@ecohouse/ui 0.1.57 → 0.1.58

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 (34) hide show
  1. package/dist/index.cjs +396 -30
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +39 -2
  4. package/dist/index.d.ts +39 -2
  5. package/dist/index.js +386 -32
  6. package/dist/index.js.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/NotificationStatus/NotificationStatus.stories.tsx +86 -0
  9. package/src/components/NotificationStatus/NotificationStatus.tsx +255 -0
  10. package/src/components/NotificationStatus/index.ts +9 -0
  11. package/src/components/index.ts +10 -0
  12. package/src/icons/DoubleCheck/DoubleCheckIcon.tsx +25 -0
  13. package/src/icons/DoubleCheck/DoubleCheckIcon.web.tsx +31 -0
  14. package/src/icons/DoubleCheck/doubleCheckPath.ts +3 -0
  15. package/src/icons/DoubleCheck/index.ts +1 -0
  16. package/src/icons/NotificationCancelled/NotificationCancelledIcon.tsx +22 -0
  17. package/src/icons/NotificationCancelled/NotificationCancelledIcon.web.tsx +21 -0
  18. package/src/icons/NotificationCancelled/index.ts +1 -0
  19. package/src/icons/NotificationCheckout/NotificationCheckoutIcon.tsx +22 -0
  20. package/src/icons/NotificationCheckout/NotificationCheckoutIcon.web.tsx +21 -0
  21. package/src/icons/NotificationCheckout/index.ts +1 -0
  22. package/src/icons/NotificationIcons.stories.tsx +99 -0
  23. package/src/icons/NotificationQrCode/NotificationQrCodeIcon.tsx +25 -0
  24. package/src/icons/NotificationQrCode/NotificationQrCodeIcon.web.tsx +24 -0
  25. package/src/icons/NotificationQrCode/index.ts +1 -0
  26. package/src/icons/NotificationSuccess/NotificationSuccessIcon.tsx +26 -0
  27. package/src/icons/NotificationSuccess/NotificationSuccessIcon.web.tsx +25 -0
  28. package/src/icons/NotificationSuccess/index.ts +1 -0
  29. package/src/icons/NotificationWarning/NotificationWarningIcon.tsx +22 -0
  30. package/src/icons/NotificationWarning/NotificationWarningIcon.web.tsx +21 -0
  31. package/src/icons/NotificationWarning/index.ts +1 -0
  32. package/src/icons/index.ts +6 -0
  33. package/src/icons/registry.ts +20 -0
  34. package/src/index.ts +13 -0
package/dist/index.cjs CHANGED
@@ -9455,15 +9455,15 @@ var require_react_dom_development = __commonJS({
9455
9455
  };
9456
9456
  }
9457
9457
  var warnValidStyle$1 = warnValidStyle;
9458
- function createDangerousStringForStyles(styles42) {
9458
+ function createDangerousStringForStyles(styles43) {
9459
9459
  {
9460
9460
  var serialized = "";
9461
9461
  var delimiter = "";
9462
- for (var styleName in styles42) {
9463
- if (!styles42.hasOwnProperty(styleName)) {
9462
+ for (var styleName in styles43) {
9463
+ if (!styles43.hasOwnProperty(styleName)) {
9464
9464
  continue;
9465
9465
  }
9466
- var styleValue = styles42[styleName];
9466
+ var styleValue = styles43[styleName];
9467
9467
  if (styleValue != null) {
9468
9468
  var isCustomProperty = styleName.indexOf("--") === 0;
9469
9469
  serialized += delimiter + (isCustomProperty ? styleName : hyphenateStyleName(styleName)) + ":";
@@ -9474,19 +9474,19 @@ var require_react_dom_development = __commonJS({
9474
9474
  return serialized || null;
9475
9475
  }
9476
9476
  }
9477
- function setValueForStyles(node, styles42) {
9477
+ function setValueForStyles(node, styles43) {
9478
9478
  var style2 = node.style;
9479
- for (var styleName in styles42) {
9480
- if (!styles42.hasOwnProperty(styleName)) {
9479
+ for (var styleName in styles43) {
9480
+ if (!styles43.hasOwnProperty(styleName)) {
9481
9481
  continue;
9482
9482
  }
9483
9483
  var isCustomProperty = styleName.indexOf("--") === 0;
9484
9484
  {
9485
9485
  if (!isCustomProperty) {
9486
- warnValidStyle$1(styleName, styles42[styleName]);
9486
+ warnValidStyle$1(styleName, styles43[styleName]);
9487
9487
  }
9488
9488
  }
9489
- var styleValue = dangerousStyleValue(styleName, styles42[styleName], isCustomProperty);
9489
+ var styleValue = dangerousStyleValue(styleName, styles43[styleName], isCustomProperty);
9490
9490
  if (styleName === "float") {
9491
9491
  styleName = "cssFloat";
9492
9492
  }
@@ -9500,9 +9500,9 @@ var require_react_dom_development = __commonJS({
9500
9500
  function isValueEmpty(value) {
9501
9501
  return value == null || typeof value === "boolean" || value === "";
9502
9502
  }
9503
- function expandShorthandMap(styles42) {
9503
+ function expandShorthandMap(styles43) {
9504
9504
  var expanded = {};
9505
- for (var key in styles42) {
9505
+ for (var key in styles43) {
9506
9506
  var longhands = shorthandToLonghand[key] || [key];
9507
9507
  for (var i = 0; i < longhands.length; i++) {
9508
9508
  expanded[longhands[i]] = key;
@@ -29539,6 +29539,25 @@ function DragHandleIcon({ size = 9, color = colors.white }) {
29539
29539
  return /* @__PURE__ */ jsxRuntime.jsx(Svg30__default.default, { width: size * 6 / 9, height: size, viewBox: "0 0 6 9", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(Svg30.Path, { d: DRAG_HANDLE_PATH, fill: color }) });
29540
29540
  }
29541
29541
 
29542
+ // src/icons/DoubleCheck/doubleCheckPath.ts
29543
+ var DOUBLE_CHECK_PATH = "M4.66683 8L7.96666 11.2998L15.0383 4.22884M1.3667 8.03353L4.66653 11.3334M11.7375 4.26237L8.20199 7.79791";
29544
+ function DoubleCheckIcon({
29545
+ size = 16,
29546
+ color = colors.primary,
29547
+ strokeWidth = 1.5
29548
+ }) {
29549
+ return /* @__PURE__ */ jsxRuntime.jsx(Svg30__default.default, { width: size, height: size, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
29550
+ Svg30.Path,
29551
+ {
29552
+ d: DOUBLE_CHECK_PATH,
29553
+ stroke: color,
29554
+ strokeWidth,
29555
+ strokeLinecap: "round",
29556
+ strokeLinejoin: "round"
29557
+ }
29558
+ ) });
29559
+ }
29560
+
29542
29561
  // src/icons/Heart/heartPath.ts
29543
29562
  var HEART_PATH = "M7.99547 3.42388C6.66257 1.8656 4.43987 1.44643 2.76984 2.87334C1.0998 4.30026 0.864686 6.68598 2.17617 8.3736C3.26659 9.77674 6.56656 12.7361 7.64811 13.6939C7.76911 13.801 7.82961 13.8546 7.90018 13.8757C7.96178 13.8941 8.02917 13.8941 8.09077 13.8757C8.16134 13.8546 8.22184 13.801 8.34284 13.6939C9.42439 12.7361 12.7244 9.77674 13.8148 8.3736C15.1263 6.68598 14.9199 4.28525 13.2211 2.87334C11.5224 1.46144 9.32838 1.8656 7.99547 3.42388Z";
29544
29563
  function HeartIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }) {
@@ -29975,6 +29994,114 @@ function NoPetsIcon({ size = 20, color = colors.white, strokeWidth = 1.5 }) {
29975
29994
  `no-pets-${index}`
29976
29995
  )) });
29977
29996
  }
29997
+ function NotificationCancelledIcon({
29998
+ size = 44,
29999
+ color = "#A63E3E",
30000
+ strokeWidth = 2,
30001
+ fillOpacity = 0.08
30002
+ }) {
30003
+ return /* @__PURE__ */ jsxRuntime.jsxs(Svg30__default.default, { width: size, height: size, viewBox: "0 0 44 44", fill: "none", children: [
30004
+ /* @__PURE__ */ jsxRuntime.jsx(Svg30.Rect, { width: "44", height: "44", rx: "22", fill: color, fillOpacity }),
30005
+ /* @__PURE__ */ jsxRuntime.jsx(
30006
+ Svg30.Path,
30007
+ {
30008
+ d: "M27 17L17 27M17 17L27 27",
30009
+ stroke: color,
30010
+ strokeWidth,
30011
+ strokeLinecap: "round",
30012
+ strokeLinejoin: "round"
30013
+ }
30014
+ )
30015
+ ] });
30016
+ }
30017
+ function NotificationCheckoutIcon({
30018
+ size = 44,
30019
+ color = "#B46436",
30020
+ strokeWidth = 2,
30021
+ fillOpacity = 0.06
30022
+ }) {
30023
+ return /* @__PURE__ */ jsxRuntime.jsxs(Svg30__default.default, { width: size, height: size, viewBox: "0 0 44 44", fill: "none", children: [
30024
+ /* @__PURE__ */ jsxRuntime.jsx(Svg30.Rect, { width: "44", height: "44", rx: "22", fill: color, fillOpacity }),
30025
+ /* @__PURE__ */ jsxRuntime.jsx(
30026
+ Svg30.Path,
30027
+ {
30028
+ d: "M17 17L27 27M20.3333 27H27V20.3333",
30029
+ stroke: color,
30030
+ strokeWidth,
30031
+ strokeLinecap: "round",
30032
+ strokeLinejoin: "round"
30033
+ }
30034
+ )
30035
+ ] });
30036
+ }
30037
+ var QR_PATH = "M17.4167 17.4167H17.425M26.5833 17.4167H26.5917M17.4167 26.5833H17.425M22.8333 22.8333H22.8417M26.5833 26.5833H26.5917M26.1667 29.5H29.5V26.1667M23.6667 25.75V29.5M29.5 23.6667H25.75M25 20.3333H28.1667C28.6334 20.3333 28.8667 20.3333 29.045 20.2425C29.2018 20.1626 29.3293 20.0351 29.4092 19.8783C29.5 19.7001 29.5 19.4667 29.5 19V15.8333C29.5 15.3666 29.5 15.1333 29.4092 14.955C29.3293 14.7982 29.2018 14.6707 29.045 14.5908C28.8667 14.5 28.6334 14.5 28.1667 14.5H25C24.5333 14.5 24.2999 14.5 24.1217 14.5908C23.9649 14.6707 23.8374 14.7982 23.7575 14.955C23.6667 15.1333 23.6667 15.3666 23.6667 15.8333V19C23.6667 19.4667 23.6667 19.7001 23.7575 19.8783C23.8374 20.0351 23.9649 20.1626 24.1217 20.2425C24.2999 20.3333 24.5333 20.3333 25 20.3333ZM15.8333 20.3333H19C19.4667 20.3333 19.7001 20.3333 19.8783 20.2425C20.0351 20.1626 20.1626 20.0351 20.2425 19.8783C20.3333 19.7001 20.3333 19.4667 20.3333 19V15.8333C20.3333 15.3666 20.3333 15.1333 20.2425 14.955C20.1626 14.7982 20.0351 14.6707 19.8783 14.5908C19.7001 14.5 19.4667 14.5 19 14.5H15.8333C15.3666 14.5 15.1333 14.5 14.955 14.5908C14.7982 14.6707 14.6707 14.7982 14.5908 14.955C14.5 15.1333 14.5 15.3666 14.5 15.8333V19C14.5 19.4667 14.5 19.7001 14.5908 19.8783C14.6707 20.0351 14.7982 20.1626 14.955 20.2425C15.1333 20.3333 15.3666 20.3333 15.8333 20.3333ZM15.8333 29.5H19C19.4667 29.5 19.7001 29.5 19.8783 29.4092C20.0351 29.3293 20.1626 29.2018 20.2425 29.045C20.3333 28.8667 20.3333 28.6334 20.3333 28.1667V25C20.3333 24.5333 20.3333 24.2999 20.2425 24.1217C20.1626 23.9649 20.0351 23.8374 19.8783 23.7575C19.7001 23.6667 19.4667 23.6667 19 23.6667H15.8333C15.3666 23.6667 15.1333 23.6667 14.955 23.7575C14.7982 23.8374 14.6707 23.9649 14.5908 24.1217C14.5 24.2999 14.5 24.5333 14.5 25V28.1667C14.5 28.6334 14.5 28.8667 14.5908 29.045C14.6707 29.2018 14.7982 29.3293 14.955 29.4092C15.1333 29.5 15.3666 29.5 15.8333 29.5Z";
30038
+ function NotificationQrCodeIcon({
30039
+ size = 44,
30040
+ color = "#B46436",
30041
+ strokeWidth = 2,
30042
+ fillOpacity = 0.06
30043
+ }) {
30044
+ return /* @__PURE__ */ jsxRuntime.jsxs(Svg30__default.default, { width: size, height: size, viewBox: "0 0 44 44", fill: "none", children: [
30045
+ /* @__PURE__ */ jsxRuntime.jsx(Svg30.Rect, { width: "44", height: "44", rx: "22", fill: color, fillOpacity }),
30046
+ /* @__PURE__ */ jsxRuntime.jsx(
30047
+ Svg30.Path,
30048
+ {
30049
+ d: QR_PATH,
30050
+ stroke: color,
30051
+ strokeWidth,
30052
+ strokeLinecap: "round",
30053
+ strokeLinejoin: "round"
30054
+ }
30055
+ )
30056
+ ] });
30057
+ }
30058
+ function NotificationSuccessIcon({
30059
+ size = 44,
30060
+ color = "#34A853",
30061
+ strokeWidth = 2,
30062
+ fillOpacity = 0.08
30063
+ }) {
30064
+ return /* @__PURE__ */ jsxRuntime.jsxs(Svg30__default.default, { width: size, height: size, viewBox: "0 0 44 44", fill: "none", children: [
30065
+ /* @__PURE__ */ jsxRuntime.jsx(
30066
+ Svg30.Path,
30067
+ {
30068
+ d: "M0 22C0 9.84974 9.84974 0 22 0C34.1503 0 44 9.84974 44 22C44 34.1503 34.1503 44 22 44C9.84974 44 0 34.1503 0 22Z",
30069
+ fill: color,
30070
+ fillOpacity
30071
+ }
30072
+ ),
30073
+ /* @__PURE__ */ jsxRuntime.jsx(
30074
+ Svg30.Path,
30075
+ {
30076
+ d: "M28.6666 17L19.4999 26.1667L15.3333 22",
30077
+ stroke: color,
30078
+ strokeWidth,
30079
+ strokeLinecap: "round",
30080
+ strokeLinejoin: "round"
30081
+ }
30082
+ )
30083
+ ] });
30084
+ }
30085
+ function NotificationWarningIcon({
30086
+ size = 44,
30087
+ color = "#A63E3E",
30088
+ strokeWidth = 2,
30089
+ fillOpacity = 0.08
30090
+ }) {
30091
+ return /* @__PURE__ */ jsxRuntime.jsxs(Svg30__default.default, { width: size, height: size, viewBox: "0 0 44 44", fill: "none", children: [
30092
+ /* @__PURE__ */ jsxRuntime.jsx(Svg30.Rect, { width: "44", height: "44", rx: "22", fill: color, fillOpacity }),
30093
+ /* @__PURE__ */ jsxRuntime.jsx(
30094
+ Svg30.Path,
30095
+ {
30096
+ d: "M21.9999 19.5V22.8333M21.9999 26.1667H22.0082M20.846 15.2431L13.9919 27.082C13.6117 27.7386 13.4216 28.0669 13.4497 28.3364C13.4742 28.5715 13.5974 28.785 13.7885 28.924C14.0077 29.0833 14.387 29.0833 15.1458 29.0833H28.8539C29.6127 29.0833 29.9921 29.0833 30.2112 28.924C30.4024 28.785 30.5255 28.5715 30.55 28.3364C30.5781 28.0669 30.388 27.7386 30.0078 27.082L23.1538 15.2431C22.775 14.5888 22.5856 14.2617 22.3385 14.1518C22.1229 14.0559 21.8768 14.0559 21.6613 14.1518C21.4142 14.2617 21.2248 14.5888 20.846 15.2431Z",
30097
+ stroke: color,
30098
+ strokeWidth,
30099
+ strokeLinecap: "round",
30100
+ strokeLinejoin: "round"
30101
+ }
30102
+ )
30103
+ ] });
30104
+ }
29978
30105
 
29979
30106
  // src/icons/Phone/phonePath.ts
29980
30107
  var PHONE_PATH = "M7.91872 3.54768C7.66561 2.91492 7.05276 2.5 6.37126 2.5H4.07895C3.20692 2.5 2.5 3.20675 2.5 4.07878C2.5 11.491 8.50898 17.5 15.9212 17.5C16.7933 17.5 17.5 16.793 17.5 15.921L17.5004 13.6283C17.5004 12.9468 17.0856 12.334 16.4528 12.0809L14.2558 11.2024C13.6874 10.9751 13.0402 11.0774 12.57 11.4693L12.0029 11.9422C11.3407 12.4941 10.3664 12.4502 9.75683 11.8407L8.16018 10.2425C7.55066 9.63302 7.50561 8.65945 8.05745 7.99724L8.53027 7.43025C8.92218 6.95996 9.02541 6.31263 8.79805 5.74424L7.91872 3.54768Z";
@@ -30472,6 +30599,11 @@ var icons = {
30472
30599
  navigate: NavigateIcon,
30473
30600
  noPets: NoPetsIcon,
30474
30601
  noSmoking: NoSmokingIcon,
30602
+ notificationCancelled: NotificationCancelledIcon,
30603
+ notificationCheckout: NotificationCheckoutIcon,
30604
+ notificationQrCode: NotificationQrCodeIcon,
30605
+ notificationSuccess: NotificationSuccessIcon,
30606
+ notificationWarning: NotificationWarningIcon,
30475
30607
  paw: PawIcon,
30476
30608
  phone: PhoneIcon,
30477
30609
  qrCode: QrCodeIcon,
@@ -30507,6 +30639,7 @@ var icons = {
30507
30639
  dollar: DollarIcon,
30508
30640
  dram: DramIcon,
30509
30641
  dragHandle: DragHandleIcon,
30642
+ doubleCheck: DoubleCheckIcon,
30510
30643
  externalLink: ExternalLinkIcon,
30511
30644
  eye: EyeIcon,
30512
30645
  image: ImageIcon,
@@ -30546,6 +30679,7 @@ var iconGroups = {
30546
30679
  "checkSuccess",
30547
30680
  "copy",
30548
30681
  "download",
30682
+ "doubleCheck",
30549
30683
  "dragHandle",
30550
30684
  "search",
30551
30685
  "calendar",
@@ -30608,6 +30742,13 @@ var iconGroups = {
30608
30742
  "whatsApp"
30609
30743
  ],
30610
30744
  communication: ["mail", "phone"],
30745
+ notifications: [
30746
+ "notificationSuccess",
30747
+ "notificationCancelled",
30748
+ "notificationCheckout",
30749
+ "notificationQrCode",
30750
+ "notificationWarning"
30751
+ ],
30611
30752
  social: ["apple", "facebook", "googlePlay", "instagram", "linkedin"],
30612
30753
  interface: [
30613
30754
  "areaExpand",
@@ -37833,6 +37974,219 @@ var styles39 = reactNative.StyleSheet.create({
37833
37974
  color: colors.white
37834
37975
  }
37835
37976
  });
37977
+ function NewBookingNotification(props) {
37978
+ return /* @__PURE__ */ jsxRuntime.jsx(NotificationStatus, { icon: /* @__PURE__ */ jsxRuntime.jsx(NotificationSuccessIcon, {}), ...props });
37979
+ }
37980
+ function CancelledBookingNotification(props) {
37981
+ return /* @__PURE__ */ jsxRuntime.jsx(NotificationStatus, { icon: /* @__PURE__ */ jsxRuntime.jsx(NotificationCancelledIcon, {}), ...props });
37982
+ }
37983
+ function GuestCheckInNotification(props) {
37984
+ return /* @__PURE__ */ jsxRuntime.jsx(NotificationStatus, { icon: /* @__PURE__ */ jsxRuntime.jsx(NotificationCheckoutIcon, {}), ...props });
37985
+ }
37986
+ function QrKeyNotification(props) {
37987
+ return /* @__PURE__ */ jsxRuntime.jsx(NotificationStatus, { icon: /* @__PURE__ */ jsxRuntime.jsx(NotificationQrCodeIcon, {}), ...props });
37988
+ }
37989
+ function BookingWarningNotification(props) {
37990
+ return /* @__PURE__ */ jsxRuntime.jsx(NotificationStatus, { icon: /* @__PURE__ */ jsxRuntime.jsx(NotificationWarningIcon, {}), ...props });
37991
+ }
37992
+ function NotificationStatusSkeleton() {
37993
+ return /* @__PURE__ */ jsxRuntime.jsxs(
37994
+ reactNative.View,
37995
+ {
37996
+ accessibilityElementsHidden: true,
37997
+ importantForAccessibility: "no-hide-descendants",
37998
+ style: styles40.root,
37999
+ children: [
38000
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles40.icon, styles40.skeletonIcon] }),
38001
+ /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles40.content, styles40.skeletonContent], children: [
38002
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles40.skeletonLine, styles40.skeletonTitle] }),
38003
+ /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles40.skeletonDescription, children: [
38004
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles40.skeletonLine, styles40.skeletonDescriptionFirst] }),
38005
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles40.skeletonLine, styles40.skeletonDescriptionSecond] })
38006
+ ] }),
38007
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles40.skeletonLine, styles40.skeletonTimestamp] })
38008
+ ] }),
38009
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles40.chevron, styles40.skeletonChevron] })
38010
+ ]
38011
+ }
38012
+ );
38013
+ }
38014
+ function NotificationStatus({
38015
+ icon,
38016
+ title,
38017
+ description,
38018
+ timestamp,
38019
+ unread = false,
38020
+ disabled = false,
38021
+ showChevron,
38022
+ onPress,
38023
+ style,
38024
+ accessibilityLabel,
38025
+ onHoverIn,
38026
+ onHoverOut,
38027
+ onPressIn,
38028
+ onPressOut,
38029
+ ...rest
38030
+ }) {
38031
+ const [active, setActive] = react.useState(false);
38032
+ const interactive = onPress !== void 0;
38033
+ return /* @__PURE__ */ jsxRuntime.jsxs(
38034
+ reactNative.Pressable,
38035
+ {
38036
+ ...rest,
38037
+ accessibilityLabel: accessibilityLabel ?? `${title}. ${description}. ${timestamp}`,
38038
+ accessibilityRole: interactive ? "button" : void 0,
38039
+ accessibilityState: { disabled },
38040
+ disabled,
38041
+ onPress,
38042
+ onHoverIn: (event) => {
38043
+ setActive(true);
38044
+ onHoverIn?.(event);
38045
+ },
38046
+ onHoverOut: (event) => {
38047
+ setActive(false);
38048
+ onHoverOut?.(event);
38049
+ },
38050
+ onPressIn: (event) => {
38051
+ setActive(true);
38052
+ onPressIn?.(event);
38053
+ },
38054
+ onPressOut: (event) => {
38055
+ setActive(false);
38056
+ onPressOut?.(event);
38057
+ },
38058
+ style: [styles40.root, active && styles40.rootActive, disabled && styles40.disabled, style],
38059
+ children: [
38060
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles40.icon, children: icon }),
38061
+ /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles40.content, children: [
38062
+ /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles40.titleRow, children: [
38063
+ unread ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles40.unreadIndicator }) : null,
38064
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: styles40.title, children: title })
38065
+ ] }),
38066
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles40.description, children: description }),
38067
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: styles40.timestamp, children: timestamp })
38068
+ ] }),
38069
+ showChevron ?? interactive ? /* @__PURE__ */ jsxRuntime.jsx(
38070
+ reactNative.View,
38071
+ {
38072
+ accessibilityElementsHidden: true,
38073
+ importantForAccessibility: "no-hide-descendants",
38074
+ style: styles40.chevron,
38075
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { color: colors.grey300, size: 16, strokeWidth: 1.5 })
38076
+ }
38077
+ ) : null
38078
+ ]
38079
+ }
38080
+ );
38081
+ }
38082
+ var styles40 = reactNative.StyleSheet.create({
38083
+ root: {
38084
+ width: "100%",
38085
+ minHeight: 111,
38086
+ flexDirection: "row",
38087
+ alignItems: "flex-start",
38088
+ gap: 16,
38089
+ padding: 16,
38090
+ backgroundColor: "transparent"
38091
+ },
38092
+ rootActive: {
38093
+ backgroundColor: colors.whiteAlpha1
38094
+ },
38095
+ disabled: {
38096
+ opacity: 0.4
38097
+ },
38098
+ icon: {
38099
+ width: 44,
38100
+ height: 44,
38101
+ flexShrink: 0
38102
+ },
38103
+ content: {
38104
+ minWidth: 0,
38105
+ flex: 1,
38106
+ alignSelf: "stretch",
38107
+ justifyContent: "space-between"
38108
+ },
38109
+ titleRow: {
38110
+ minWidth: 0,
38111
+ flexDirection: "row",
38112
+ alignItems: "center",
38113
+ gap: 10
38114
+ },
38115
+ unreadIndicator: {
38116
+ width: 8,
38117
+ height: 8,
38118
+ flexShrink: 0,
38119
+ borderRadius: 4,
38120
+ backgroundColor: colors.primaryLight
38121
+ },
38122
+ title: {
38123
+ minWidth: 0,
38124
+ flex: 1,
38125
+ color: colors.white,
38126
+ fontFamily: fonts.sans,
38127
+ fontSize: 14,
38128
+ fontWeight: "600",
38129
+ lineHeight: 14,
38130
+ letterSpacing: 0
38131
+ },
38132
+ description: {
38133
+ color: colors.lightGrey,
38134
+ fontFamily: fonts.sans,
38135
+ fontSize: 12,
38136
+ fontWeight: "400",
38137
+ lineHeight: 16,
38138
+ letterSpacing: 0
38139
+ },
38140
+ timestamp: {
38141
+ color: colors.grey50,
38142
+ fontFamily: fonts.sans,
38143
+ fontSize: 12,
38144
+ fontWeight: "400",
38145
+ lineHeight: 16,
38146
+ letterSpacing: 0
38147
+ },
38148
+ chevron: {
38149
+ alignSelf: "center",
38150
+ flexShrink: 0
38151
+ },
38152
+ skeletonIcon: {
38153
+ borderRadius: 22,
38154
+ backgroundColor: colors.grey600
38155
+ },
38156
+ skeletonContent: {
38157
+ paddingTop: 1,
38158
+ paddingBottom: 2
38159
+ },
38160
+ skeletonLine: {
38161
+ borderRadius: 999,
38162
+ backgroundColor: colors.grey500
38163
+ },
38164
+ skeletonTitle: {
38165
+ width: "42%",
38166
+ height: 12
38167
+ },
38168
+ skeletonDescription: {
38169
+ gap: 5
38170
+ },
38171
+ skeletonDescriptionFirst: {
38172
+ width: "92%",
38173
+ height: 10
38174
+ },
38175
+ skeletonDescriptionSecond: {
38176
+ width: "68%",
38177
+ height: 10
38178
+ },
38179
+ skeletonTimestamp: {
38180
+ width: 58,
38181
+ height: 10
38182
+ },
38183
+ skeletonChevron: {
38184
+ width: 7,
38185
+ height: 12,
38186
+ borderRadius: 4,
38187
+ backgroundColor: colors.grey500
38188
+ }
38189
+ });
37836
38190
 
37837
38191
  // src/components/Range/Range.utils.ts
37838
38192
  function decimals(value) {
@@ -38207,7 +38561,7 @@ var Range = react.forwardRef(function Range2({
38207
38561
  ...rest,
38208
38562
  ref: setRootRef,
38209
38563
  onLayout,
38210
- style: [styles40.root, disabled && styles40.disabled, style],
38564
+ style: [styles41.root, disabled && styles41.disabled, style],
38211
38565
  children: [
38212
38566
  /* @__PURE__ */ jsxRuntime.jsxs(
38213
38567
  reactNative.Pressable,
@@ -38221,16 +38575,16 @@ var Range = react.forwardRef(function Range2({
38221
38575
  updateNearestFromTrack(event.nativeEvent.offsetX);
38222
38576
  } : void 0,
38223
38577
  onPress: reactNative.Platform.OS === "web" ? void 0 : handleTrackPress,
38224
- style: styles40.sliderPlane,
38578
+ style: styles41.sliderPlane,
38225
38579
  tabIndex: -1,
38226
38580
  children: [
38227
- /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", style: styles40.track }),
38581
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", style: styles41.track }),
38228
38582
  /* @__PURE__ */ jsxRuntime.jsx(
38229
38583
  reactNative.View,
38230
38584
  {
38231
38585
  pointerEvents: "none",
38232
38586
  style: [
38233
- styles40.activeTrack,
38587
+ styles41.activeTrack,
38234
38588
  {
38235
38589
  left: TRACK_HORIZONTAL_INSET + fromOffset,
38236
38590
  width: toOffset - fromOffset + THUMB_SIZE2
@@ -38272,9 +38626,9 @@ var Range = react.forwardRef(function Range2({
38272
38626
  onAccessibilityAction: (event) => handleAccessibilityAction(event, effectiveFrom, updateFromInput),
38273
38627
  pointerEvents: disabled ? "none" : "auto",
38274
38628
  style: [
38275
- styles40.thumb,
38276
- reactNative.Platform.OS === "web" && styles40.thumbWeb,
38277
- focusedThumb === "from" && reactNative.Platform.OS === "web" && styles40.thumbFocusedWeb,
38629
+ styles41.thumb,
38630
+ reactNative.Platform.OS === "web" && styles41.thumbWeb,
38631
+ focusedThumb === "from" && reactNative.Platform.OS === "web" && styles41.thumbFocusedWeb,
38278
38632
  { left: TRACK_HORIZONTAL_INSET + fromOffset }
38279
38633
  ],
38280
38634
  tabIndex: disabled ? -1 : 0
@@ -38314,9 +38668,9 @@ var Range = react.forwardRef(function Range2({
38314
38668
  onAccessibilityAction: (event) => handleAccessibilityAction(event, effectiveTo, updateToInput),
38315
38669
  pointerEvents: disabled ? "none" : "auto",
38316
38670
  style: [
38317
- styles40.thumb,
38318
- reactNative.Platform.OS === "web" && styles40.thumbWeb,
38319
- focusedThumb === "to" && reactNative.Platform.OS === "web" && styles40.thumbFocusedWeb,
38671
+ styles41.thumb,
38672
+ reactNative.Platform.OS === "web" && styles41.thumbWeb,
38673
+ focusedThumb === "to" && reactNative.Platform.OS === "web" && styles41.thumbFocusedWeb,
38320
38674
  { left: TRACK_HORIZONTAL_INSET + toOffset }
38321
38675
  ],
38322
38676
  tabIndex: disabled ? -1 : 0
@@ -38325,7 +38679,7 @@ var Range = react.forwardRef(function Range2({
38325
38679
  ]
38326
38680
  }
38327
38681
  ),
38328
- /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles40.inputs, children: [
38682
+ /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles41.inputs, children: [
38329
38683
  /* @__PURE__ */ jsxRuntime.jsx(
38330
38684
  RangeInput,
38331
38685
  {
@@ -38376,7 +38730,7 @@ function RangeInput({
38376
38730
  placeholder,
38377
38731
  value
38378
38732
  }) {
38379
- return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles40.inputField, focused && styles40.inputFieldFocused], children: [
38733
+ return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles41.inputField, focused && styles41.inputFieldFocused], children: [
38380
38734
  /* @__PURE__ */ jsxRuntime.jsx(
38381
38735
  reactNative.TextInput,
38382
38736
  {
@@ -38392,15 +38746,15 @@ function RangeInput({
38392
38746
  placeholder,
38393
38747
  placeholderTextColor: colors.grey150,
38394
38748
  returnKeyType: "done",
38395
- style: [styles40.input, reactNative.Platform.OS === "web" && styles40.inputWeb],
38749
+ style: [styles41.input, reactNative.Platform.OS === "web" && styles41.inputWeb],
38396
38750
  tabIndex: disabled ? -1 : void 0,
38397
38751
  value
38398
38752
  }
38399
38753
  ),
38400
- /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles40.currencySlot, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles40.currency, children: currency }) })
38754
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles41.currencySlot, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles41.currency, children: currency }) })
38401
38755
  ] });
38402
38756
  }
38403
- var styles40 = reactNative.StyleSheet.create({
38757
+ var styles41 = reactNative.StyleSheet.create({
38404
38758
  root: {
38405
38759
  width: DEFAULT_WIDTH6,
38406
38760
  gap: 15,
@@ -38545,16 +38899,16 @@ var RadioButton = react.forwardRef(
38545
38899
  accessibilityRole: "radio",
38546
38900
  accessibilityLabel: resolvedAccessibilityLabel,
38547
38901
  accessibilityState: { selected: isActive, disabled },
38548
- style: [styles41.root, disabled && styles41.disabled, style],
38902
+ style: [styles42.root, disabled && styles42.disabled, style],
38549
38903
  children: [
38550
- /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles41.control, children: isActive ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles41.dot }) : null }),
38551
- labelContent != null && labelContent !== false ? typeof labelContent === "string" || typeof labelContent === "number" ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles41.label, labelStyle], children: labelContent }) : labelContent : null
38904
+ /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles42.control, children: isActive ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles42.dot }) : null }),
38905
+ labelContent != null && labelContent !== false ? typeof labelContent === "string" || typeof labelContent === "number" ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles42.label, labelStyle], children: labelContent }) : labelContent : null
38552
38906
  ]
38553
38907
  }
38554
38908
  );
38555
38909
  }
38556
38910
  );
38557
- var styles41 = reactNative.StyleSheet.create({
38911
+ var styles42 = reactNative.StyleSheet.create({
38558
38912
  root: {
38559
38913
  flexDirection: "row",
38560
38914
  alignItems: "center",
@@ -38720,6 +39074,7 @@ exports.BathroomsIcon = BathroomsIcon;
38720
39074
  exports.BedroomsIcon = BedroomsIcon;
38721
39075
  exports.BellIcon = BellIcon;
38722
39076
  exports.BlockedGuestsIcon = BlockedGuestsIcon;
39077
+ exports.BookingWarningNotification = BookingWarningNotification;
38723
39078
  exports.BrandLogo = BrandLogo;
38724
39079
  exports.BuildingIcon = BuildingIcon;
38725
39080
  exports.Button = Button;
@@ -38729,6 +39084,7 @@ exports.CalendarMinusIcon = CalendarMinusIcon;
38729
39084
  exports.CalendarOutlineIcon = CalendarOutlineIcon;
38730
39085
  exports.CameraFilledIcon = CameraFilledIcon;
38731
39086
  exports.CameraIcon = CameraIcon;
39087
+ exports.CancelledBookingNotification = CancelledBookingNotification;
38732
39088
  exports.CardLocationIcon = CardLocationIcon;
38733
39089
  exports.CheckBadgeIcon = CheckBadgeIcon;
38734
39090
  exports.CheckIcon = CheckIcon;
@@ -38750,6 +39106,7 @@ exports.CutleryIcon = CutleryIcon;
38750
39106
  exports.DatePicker = DatePicker;
38751
39107
  exports.DeactivateIcon = DeactivateIcon;
38752
39108
  exports.DollarIcon = DollarIcon;
39109
+ exports.DoubleCheckIcon = DoubleCheckIcon;
38753
39110
  exports.DownloadIcon = DownloadIcon;
38754
39111
  exports.DragHandleIcon = DragHandleIcon;
38755
39112
  exports.DramIcon = DramIcon;
@@ -38764,6 +39121,7 @@ exports.FloatingActionButton = FloatingActionButton;
38764
39121
  exports.FullscreenIcon = FullscreenIcon;
38765
39122
  exports.GlobeIcon = GlobeIcon;
38766
39123
  exports.GooglePlayIcon = GooglePlayIcon;
39124
+ exports.GuestCheckInNotification = GuestCheckInNotification;
38767
39125
  exports.GuestsIcon = GuestsIcon;
38768
39126
  exports.HeadsetIcon = HeadsetIcon;
38769
39127
  exports.HeartIcon = HeartIcon;
@@ -38799,14 +39157,22 @@ exports.Modal = Modal;
38799
39157
  exports.MoonStarsIcon = MoonStarsIcon;
38800
39158
  exports.MoreHorizontalIcon = MoreHorizontalIcon;
38801
39159
  exports.NavigateIcon = NavigateIcon;
39160
+ exports.NewBookingNotification = NewBookingNotification;
38802
39161
  exports.NoPetsIcon = NoPetsIcon;
38803
39162
  exports.NoReviewIcon = NoReviewIcon;
38804
39163
  exports.NoSmokingIcon = NoSmokingIcon;
39164
+ exports.NotificationCancelledIcon = NotificationCancelledIcon;
39165
+ exports.NotificationCheckoutIcon = NotificationCheckoutIcon;
39166
+ exports.NotificationQrCodeIcon = NotificationQrCodeIcon;
39167
+ exports.NotificationStatusSkeleton = NotificationStatusSkeleton;
39168
+ exports.NotificationSuccessIcon = NotificationSuccessIcon;
39169
+ exports.NotificationWarningIcon = NotificationWarningIcon;
38805
39170
  exports.PaginationDots = PaginationDots;
38806
39171
  exports.PawIcon = PawIcon;
38807
39172
  exports.PhoneIcon = PhoneIcon;
38808
39173
  exports.PlusIcon = PlusIcon;
38809
39174
  exports.QrCodeIcon = QrCodeIcon;
39175
+ exports.QrKeyNotification = QrKeyNotification;
38810
39176
  exports.QuantityInput = QuantityInput;
38811
39177
  exports.QuietHoursIcon = QuietHoursIcon;
38812
39178
  exports.RadioButton = RadioButton;