apirocket 0.7.4 → 0.8.0

package/dist/components/notifications/notifications.service.d.ts

@@ -0,0 +1,9 @@
+import type { NotificationInstance, NotificationItem, NotificationsService } from './notifications.types';
+declare class NotificationsServiceClass implements NotificationsService {
+    #private;
+    constructor();
+    add(notification: NotificationItem): NotificationInstance;
+    delete(index: number): void;
+}
+export declare const notificationsService: Readonly<NotificationsServiceClass>;
+export {};

package/dist/components/notifications/notifications.types.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="node" />
+export type NotificationItem = {
+    text: string;
+    position?: NotificationPosition;
+    time?: number;
+};
+export type NotificationInstance = {
+    index: number;
+    text: string;
+    position: NotificationPosition;
+    timer?: NodeJS.Timeout;
+};
+export type NotificationsMap = Map<number, NotificationInstance>;
+export type NotificationPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+export interface NotificationsService {
+    add: (notification: NotificationItem) => void;
+    delete: (index: number) => void;
+}

package/dist/ecommerce.css

@@ -84,7 +84,8 @@
 	top: 0;
 	overflow: hidden;
 	width: var(--cart-width, 540px);
-	height: 100vh;
+	height: 100dvh;
+	/* height: fit-content; */
 	box-shadow: 1px 20px 8px rgba(0,0,0,.1);
 	font-family: var(--cart-font-family, "Arial, Helvetica, sans-serif");
 	background-color: var(--cart-background-color, #fff);
@@ -562,7 +563,7 @@
 	flex: 0 0 50px;
 	font-size: 16px;
 	font-weight: normal;
-	color: #a3a3a3;	
+	color: #a3a3a3;
 	text-align: right;
 }
 
@@ -570,7 +571,7 @@
 	flex: 0 0 100px;
 	font-size: 16px;
 	font-weight: bold;
-	color: #404040;		
+	color: #404040;
 	text-align: right;
 }
 
@@ -592,7 +593,7 @@
 	font-size: 18px;
 	font-weight: bold;
 	line-height: 18px;
-	color: #404040;	
+	color: #404040;
 }
 
 .apirocket-checkout-summary-row-total {
@@ -622,7 +623,7 @@
 	font-size: 24px;
 	font-weight: bold;
 	line-height: 24px;
-	color: #404040;	
+	color: #404040;
 }
 
 .apirocket-checkout-breadcrumbs ol {
@@ -678,11 +679,15 @@
 	padding: 16px;
 }
 
+.apirocket-checkout-steps-summary-row:last-child {
+  border-bottom: none !important;
+}
+
 .apirocket-checkout-steps-summary-label {
 	flex: 0 0 90px;
 	font-size: 14px;
 	font-weight: normal;
-	line-height: 14px;	
+	line-height: 14px;
 	color: #a3a3a3;
 }
 
@@ -855,11 +860,11 @@
 	font-weight: bold;
 }
 
-.apirocket-checkout-mobile-summary { 
+.apirocket-checkout-mobile-summary {
 	background-color: #f5f5f5;
 	transition-property: max-height;
 	transition-timing-function: ease-in;
-	transition-duration: 350ms;	
+	transition-duration: 350ms;
 	max-height: 0px;
 	overflow: hidden;
 	border-bottom: 1px solid #d9d9d9;
@@ -871,8 +876,8 @@
 }
 
 .apirocket-checkout-mobile-summary-wrapper {
-	width: 90%; 
-	max-width: 560px; 
+	width: 90%;
+	max-width: 560px;
 	padding: 16px 0px;
 	margin: 0 auto;
 }
@@ -918,7 +923,7 @@
  }
 .apirocket-checkout-fieldset-row > * { flex: 1 1; margin-right: 16px; }
 .apirocket-checkout-fieldset-row > :first-child { flex: 1 1 auto;}
-.apirocket-checkout-fieldset-row > :last-child { 
+.apirocket-checkout-fieldset-row > :last-child {
 	flex: 0 0 auto;
 	margin-right: 0px;
 	font-size: 16px;
@@ -927,9 +932,9 @@
 	color: #404040;
 }
 
-.apirocket-checkout-fieldset-row > :last-child img { 
+.apirocket-checkout-fieldset-row > :last-child img {
 	display: block;
-	max-height: 24px; 
+	max-height: 24px;
 }
 
 .apirocket-checkout-fieldset-row-wrapper {
@@ -945,29 +950,113 @@
 .apirocket-checkout-text-xl { font-size: 18px !important; }
 .apirocket-checkout-text-xxl { font-size: 20px !important; }
 
+
+.apirocket-checkout-discountcode {
+  padding-left: 2px;
+  padding-right: 2px;
+	padding-bottom: 0px;
+	margin-bottom: 8px;
+	border-bottom: 1px solid #d9d9d9;
+}
+
+.apirocket-checkout-discountcode.apirocket-checkout-discountcode-mobile {
+  display: none;
+  margin-top: 48px;
+  margin-bottom: 0px;
+  border-bottom: none !important;
+}
+
+.apirocket-checkout-discountcode.apirocket-checkout-discountcode-mobile .apirocket-checkout-discountcode-codes {
+  margin-bottom: 0px !important;
+}
+
+.apirocket-checkout-discountcode-input {
+  display: flex;
+  justify-content: space-between;
+}
+
+.apirocket-checkout-discountcode .apirocket-form-input {
+  flex: 1 1 0%;
+  margin-right: 16px;
+}
+
+.apirocket-checkout-discountcode button {
+  font-size: 14px !important;
+  width: 100px !important;
+}
+
+.apirocket-checkout-discountcode-codes {
+  width: 100%;
+  margin-bottom: 8px;
+}
+
+.apirocket-checkout-discountcode-code {
+  display: inline-flex;
+  align-content: center;
+  background-color: #e5e5e5;
+  font-size: 12px;
+  line-height: 16px;
+  color: #737373;
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  margin-right: 8px;
+  margin-bottom: 8px;
+}
+
+.apirocket-checkout-discountcode-code-name {
+  display: flex;
+  align-items: center;
+  padding: 4px 8px;
+  user-select: none;
+}
+
+.apirocket-checkout-discountcode-code-name svg {
+  padding-right: 8px;
+}
+
+.apirocket-checkout-discountcode-code-close {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 24px;
+  color: #e5e5e5;
+  background-color: #c4c4c4;
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+  cursor: pointer;
+	transition-property: color, border-color, background-color, box-shadow;
+	transition-timing-function: ease;
+	transition-duration: 350ms;
+}
+
+.apirocket-checkout-discountcode-code-close:hover {
+  background-color: #000000;
+  color: #ffffff;
+}
+
 /* Responsive */
 
 @media (max-width: 1000px) {
 
 	.apirocket-checkout-mobile { display: block; }
-	
+
 	.apirocket-checkout-wrap {
 		flex-flow: column;
 		margin: 0;
 		padding: 0;
 		width: 100%;
 	}
-	
+
 	.apirocket-checkout-main,
-	.apirocket-checkout-summary { 
-		width: 90%; 
-		max-width: 560px; 
+	.apirocket-checkout-summary {
+		width: 90%;
+		max-width: 560px;
 		margin: 0 auto;
 		padding: 0;
 	}
 
-	.apirocket-checkout-summary { 
-		/* order: 0; 
+	.apirocket-checkout-summary {
+		/* order: 0;
 		padding: 16px 0; */
 		display: none;
 	}
@@ -978,7 +1067,7 @@
 
 	.apirocket-checkout-continue { display: none; }
 	.apirocket-checkout-close { display: block; }
-	
+
 	.apirocket-checkout-breadcrumbs { text-align: center; }
 	.apirocket-checkout-breadcrumbs ol { display: inline-flex; text-align: center; }
 
@@ -990,10 +1079,10 @@
 
 	.apirocket-checkout-row { display: block; }
 	.apirocket-checkout-row > * { margin-right: 0; }
-	
+
 	.apirocket-checkout-actions > :first-child { order: 2; }
 	.apirocket-checkout-actions > :last-child { margin-bottom: 32px; }
-	.apirocket-checkout-actions { 
+	.apirocket-checkout-actions {
 		flex-flow: column;
 		align-items: stretch;
 	}
@@ -1002,13 +1091,13 @@
 
 	.apirocket-checkout-fieldset-row-wrapper .apirocket-checkout-row > * { margin-bottom: 16px !important; }
 	.apirocket-checkout-fieldset-row-wrapper .apirocket-checkout-row:last-child > *:last-child { margin-bottom: 0px !important; }
-	
+
 	.apirocket-checkout-section-subtitle {
 		padding-top: 16px;
 		margin-bottom: -16px;
 	}
 
-	.apirocket-checkout-footer ul { 
+	.apirocket-checkout-footer ul {
 		display: block;
 		text-align: center !important;
 		line-height: 32px !important;
@@ -1024,29 +1113,29 @@
 		flex: 0 0 auto;
 		max-width: 80px;
 	}
-	
-	.apirocket-checkout-summary-item-col-image img { 
+
+	.apirocket-checkout-summary-item-col-image img {
 		max-height: 80px;
 	}
-	
+
 	.apirocket-checkout-summary-item-col-description {
 		flex: 1 1;
 		padding-left: 8px;
 		font-size: 14px;
 		line-height: 16px;
 	}
-	
+
 	.apirocket-checkout-summary-item-col-description small { font-size: 12px; }
-	
+
 	.apirocket-checkout-summary-item-col-quantity {
 		flex: 0 0 25px;
 		font-size: 12px;
 	}
-	
+
 	.apirocket-checkout-summary-item-col-price {
 		flex: 0 0 80px;
 		font-size: 14px;
-	}	
+	}
 
 	.apirocket-checkout-summary-label-total {
 		font-size: 16px;
@@ -1063,14 +1152,14 @@
 
 	.apirocket-checkout-summary-label {
 		font-size: 14px;
-		line-height: 14px;		
+		line-height: 14px;
 	}
 
 	.apirocket-checkout-summary-value,
 	.apirocket-checkout-summary-value-total {
 		font-size: 16px;
 		line-height: 16px;
-	}	
+	}
 
 	.apirocket-checkout-mobile .apirocket-checkout-logo img {
 		max-height: 55px;
@@ -1080,14 +1169,17 @@
 
 	.apirocket-checkout-steps-summary-row { position: relative; }
 
-	.apirocket-checkout-steps-summary-label { 
+	.apirocket-checkout-steps-summary-label {
 		position: absolute;
 		font-size: 14px;
 	}
 
 	.apirocket-checkout-steps-summary-text { margin-top: 18px; }
 	.apirocket-checkout-steps-summary-link { font-size: 12px; }
-	
+
+  .apirocket-checkout-discountcode.apirocket-checkout-discountcode-mobile {
+    display: block;
+  }
 }
 
 
@@ -1508,6 +1600,23 @@ button.apirocket-button-primary:disabled {
 	box-shadow: var(--cart-shadow-button-primary-hover, none);
 }
 
+.apirocket-button-discount,
+button.apirocket-button-discount {
+	background-color: #c4c4c4;
+	border: 1px solid var(--cart-button-border-color, #e5e5e5);
+	color: #fff;
+  height: 46px !important;
+  text-decoration: none !important;
+}
+
+.apirocket-button-discount:hover,
+.apirocket-button-discount.active {
+	background-color: #000000;
+	border-color: #000000;
+  color: #fff;
+	box-shadow: #000000;
+}
+
 
 @media (max-width: 720px) {
 
@@ -1581,6 +1690,10 @@ button.apirocket-button-primary:disabled {
   display: none !important;
 }
 
+.apirocket-tab-menu-item {
+  white-space: nowrap;
+}
+
 
 .apirocket-tab-panel { 
 	display: none; 
@@ -1732,6 +1845,7 @@ button.apirocket-button-primary:disabled {
 	font-weight: normal;
 	color: #404040;
 	cursor: pointer;
+  text-align: left;
 }
 
 .apirocket-form-checkbox-label small {
@@ -2053,6 +2167,19 @@ button.apirocket-button-primary:disabled {
 	box-shadow: 0 0 0 1px #dc2626;
 }
 
+
+
+@media (max-width: 720px) {
+  .apirocket-checkout input,
+  .apirocket-checkout textarea,
+  .apirocket-checkout select,
+  .apirocket-my-account input,
+  .apirocket-my-account textarea,
+  .apirocket-my-account select,
+  .apirocket-modal input,
+  .apirocket-modal textarea,
+  .apirocket-modal select { font-size: 16px !important;}
+}
 .apirocket-error-block {
 	display: flex;
 	justify-content: start;