kupos-ui-components-lib 10.4.13 → 10.4.15

package/dist/index.d.ts

@@ -15,7 +15,7 @@ export type { MobileServiceItemProps } from "./components/ServiceItem/mobileType
 export type { PaymentSideBarProps } from "./components/PaymentSideBar/types";
 export type { ServiceListProps } from "./components/ServiceList/types";
 export type { FilterBarProps } from "./components/FilterBar/tyoes";
-export type { FilterCategory, FilterCategoryKey, FilterCategoryKind, FilterOptionItem, PriceRangeValue, FilterSortBarColors, FilterSortBarIcons, FilterSortBarMobileProps, TimeOfDayVariant, } from "./components/FilterSortBar";
+export type { FilterCategory, FilterCategoryKey, FilterCategoryKind, FilterOptionItem, PriceRangeValue, FilterSortBarColors, FilterSortBarIcons, FilterSortBarMobileProps, TimeOfDayVariant, SortDirection, SortOption, } from "./components/FilterSortBar";
 export { DEFAULT_CATEGORY_LABELS } from "./components/FilterSortBar";
 export type { SurveyProps } from "./components/Survey/types";
 export type { ModalProps, ModalVariant, ModalSize, ModalHeaderProps } from "./ui/Modal";

package/dist/styles.css

@@ -45,6 +45,9 @@
 .top-\[5px\] {
   top: 5px;
 }
+.top-\[8px\] {
+  top: 8px;
+}
 .top-\[15px\] {
   top: 15px;
 }
@@ -96,6 +99,9 @@
 .-bottom-\[40px\] {
   bottom: calc(40px * -1);
 }
+.bottom-\[8px\] {
+  bottom: 8px;
+}
 .bottom-\[11px\] {
   bottom: 11px;
 }
@@ -120,6 +126,9 @@
 .left-\[0\] {
   left: 0;
 }
+.left-\[0px\] {
+  left: 0px;
+}
 .left-\[11\%\] {
   left: 11%;
 }
@@ -138,6 +147,9 @@
 .-z-10 {
   z-index: calc(10 * -1);
 }
+.z-0 {
+  z-index: 0;
+}
 .z-1 {
   z-index: 1;
 }
@@ -219,6 +231,9 @@
 .mt-\[6px\] {
   margin-top: 6px;
 }
+.mt-\[8px\] {
+  margin-top: 8px;
+}
 .mt-\[10px\] {
   margin-top: 10px;
 }
@@ -309,6 +324,9 @@
 .mb-\[20px\] {
   margin-bottom: 20px;
 }
+.mb-\[28px\] {
+  margin-bottom: 28px;
+}
 .mb-\[50px\] {
   margin-bottom: 50px;
 }
@@ -345,6 +363,9 @@
 .ml-auto {
   margin-left: auto;
 }
+.box-border {
+  box-sizing: border-box;
+}
 .block {
   display: block;
 }
@@ -372,6 +393,9 @@
 .h-\[2\.5rem\] {
   height: 2.5rem;
 }
+.h-\[3px\] {
+  height: 3px;
+}
 .h-\[7px\] {
   height: 7px;
 }
@@ -417,6 +441,9 @@
 .h-\[100\%\] {
   height: 100%;
 }
+.h-\[calc\(65vh-40px\)\] {
+  height: calc(65vh - 40px);
+}
 .h-auto {
   height: auto;
 }
@@ -432,6 +459,12 @@
 .min-h-\[2\.5rem\] {
   min-height: 2.5rem;
 }
+.min-h-\[44px\] {
+  min-height: 44px;
+}
+.w-\[4px\] {
+  width: 4px;
+}
 .w-\[7px\] {
   width: 7px;
 }
@@ -489,6 +522,9 @@
 .w-\[115px\] {
   width: 115px;
 }
+.w-\[120px\] {
+  width: 120px;
+}
 .w-\[150px\] {
   width: 150px;
 }
@@ -524,6 +560,9 @@
   width: -moz-max-content;
   width: max-content;
 }
+.w-px {
+  width: 1px;
+}
 .max-w-\[120px\] {
   max-width: 120px;
 }
@@ -548,6 +587,9 @@
 .flex-shrink {
   flex-shrink: 1;
 }
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
 .shrink-0 {
   flex-shrink: 0;
 }
@@ -579,12 +621,18 @@
 .cursor-default {
   cursor: default;
 }
+.cursor-grab {
+  cursor: grab;
+}
 .cursor-not-allowed {
   cursor: not-allowed;
 }
 .cursor-pointer {
   cursor: pointer;
 }
+.\[touch-action\:none\] {
+  touch-action: none;
+}
 .resize {
   resize: both;
 }
@@ -704,6 +752,9 @@
   -moz-column-gap: 8px;
        column-gap: 8px;
 }
+.self-stretch {
+  align-self: stretch;
+}
 .truncate {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -712,12 +763,21 @@
 .overflow-hidden {
   overflow: hidden;
 }
+.overflow-visible {
+  overflow: visible;
+}
 .overflow-x-auto {
   overflow-x: auto;
 }
+.overflow-y-auto {
+  overflow-y: auto;
+}
 .overflow-y-hidden {
   overflow-y: hidden;
 }
+.rounded-\[2px\] {
+  border-radius: 2px;
+}
 .rounded-\[4px\] {
   border-radius: 4px;
 }
@@ -754,6 +814,9 @@
 .rounded-full {
   border-radius: calc(infinity * 1px);
 }
+.rounded-tr-\[4px\] {
+  border-top-right-radius: 4px;
+}
 .rounded-b-\[10px\] {
   border-bottom-right-radius: 10px;
   border-bottom-left-radius: 10px;
@@ -766,6 +829,9 @@
   border-bottom-right-radius: 14px;
   border-bottom-left-radius: 14px;
 }
+.rounded-br-\[4px\] {
+  border-bottom-right-radius: 4px;
+}
 .border {
   border-style: var(--tw-border-style);
   border-width: 1px;
@@ -837,6 +903,9 @@
 .border-\[\#363c48\] {
   border-color: #363c48;
 }
+.border-\[\#E5E5E5\] {
+  border-color: #E5E5E5;
+}
 .border-\[\#ccc\] {
   border-color: #ccc;
 }
@@ -864,9 +933,15 @@
 .bg-\[\#222b3d\] {
   background-color: #222b3d;
 }
+.bg-\[\#E5E5E5\] {
+  background-color: #E5E5E5;
+}
 .bg-\[\#E6E6E6\] {
   background-color: #E6E6E6;
 }
+.bg-\[\#F9FAFB\] {
+  background-color: #F9FAFB;
+}
 .bg-\[\#FF5C60\] {
   background-color: #FF5C60;
 }
@@ -876,6 +951,9 @@
 .bg-\[\#FFF2F2\] {
   background-color: #FFF2F2;
 }
+.bg-\[\#FFFFFF\] {
+  background-color: #FFFFFF;
+}
 .bg-\[\#eaeaea\] {
   background-color: #eaeaea;
 }
@@ -910,12 +988,21 @@
   -o-object-fit: contain;
      object-fit: contain;
 }
+.p-\[4px\] {
+  padding: 4px;
+}
 .p-\[6px_0px\] {
   padding: 6px 0px;
 }
+.p-\[6px_10px_8px\] {
+  padding: 6px 10px 8px;
+}
 .p-\[6px_20px\] {
   padding: 6px 20px;
 }
+.p-\[8px_4px_4px\] {
+  padding: 8px 4px 4px;
+}
 .p-\[10px_15px\] {
   padding: 10px 15px;
 }
@@ -988,6 +1075,9 @@
 .py-\[12px\] {
   padding-block: 12px;
 }
+.py-\[24px\] {
+  padding-block: 24px;
+}
 .pt-\[4px\] {
   padding-top: 4px;
 }
@@ -997,6 +1087,9 @@
 .pt-\[14px\] {
   padding-top: 14px;
 }
+.pt-\[16px\] {
+  padding-top: 16px;
+}
 .pt-\[20px\] {
   padding-top: 20px;
 }
@@ -1012,6 +1105,9 @@
 .pt-\[50px\] {
   padding-top: 50px;
 }
+.pr-\[8px\] {
+  padding-right: 8px;
+}
 .pr-\[10px\] {
   padding-right: 10px;
 }
@@ -1021,9 +1117,15 @@
 .pr-\[17px\] {
   padding-right: 17px;
 }
+.pr-\[20px\] {
+  padding-right: 20px;
+}
 .pr-\[22px\] {
   padding-right: 22px;
 }
+.pb-\[2px\] {
+  padding-bottom: 2px;
+}
 .pb-\[6px\] {
   padding-bottom: 6px;
 }
@@ -1048,6 +1150,12 @@
 .pl-\[6px\] {
   padding-left: 6px;
 }
+.pl-\[16px\] {
+  padding-left: 16px;
+}
+.pl-\[20px\] {
+  padding-left: 20px;
+}
 .pl-\[22px\] {
   padding-left: 22px;
 }
@@ -1066,6 +1174,12 @@
 .text-right {
   text-align: right;
 }
+.font-\[\'DMSans-Bold\'\,sans-serif\] {
+  font-family: 'DMSans-Bold',sans-serif;
+}
+.font-\[\'DMSans-Regular\'\,sans-serif\] {
+  font-family: 'DMSans-Regular',sans-serif;
+}
 .text-\[9px\] {
   font-size: 9px;
 }
@@ -1172,6 +1286,10 @@
   --tw-font-weight: 900;
   font-weight: 900;
 }
+.tracking-\[0\.4px\] {
+  --tw-tracking: 0.4px;
+  letter-spacing: 0.4px;
+}
 .break-normal {
   overflow-wrap: normal;
   word-break: normal;
@@ -1194,6 +1312,9 @@
 .text-\[\#6a6a6a\] {
   color: #6a6a6a;
 }
+.text-\[\#9B9B9B\] {
+  color: #9B9B9B;
+}
 .text-\[\#9b9b9b\] {
   color: #9b9b9b;
 }
@@ -1267,14 +1388,26 @@
 .opacity-100 {
   opacity: 100%;
 }
+.shadow-\[0_1px_4px_rgba\(0\,0\,0\,0\.25\)\] {
+  --tw-shadow: 0 1px 4px var(--tw-shadow-color, rgba(0,0,0,0.25));
+  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+}
 .outline {
   outline-style: var(--tw-outline-style);
   outline-width: 1px;
 }
+.brightness-0 {
+  --tw-brightness: brightness(0%);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+}
 .grayscale {
   --tw-grayscale: grayscale(100%);
   filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
 }
+.invert {
+  --tw-invert: invert(100%);
+  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+}
 .filter {
   filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
 }
@@ -1286,6 +1419,11 @@
   transition-timing-function: var(--tw-ease, ease);
   transition-duration: var(--tw-duration, 0s);
 }
+.transition-\[padding\] {
+  transition-property: padding;
+  transition-timing-function: var(--tw-ease, ease);
+  transition-duration: var(--tw-duration, 0s);
+}
 .transition-all {
   transition-property: all;
   transition-timing-function: var(--tw-ease, ease);
@@ -1318,6 +1456,12 @@
   -moz-user-select: none;
        user-select: none;
 }
+.\[-webkit-tap-highlight-color\:transparent\] {
+  -webkit-tap-highlight-color: transparent;
+}
+.\[scrollbar-width\:none\] {
+  scrollbar-width: none;
+}
 .group-hover\:block {
   &:is(:where(.group):hover *) {
     @media (hover: hover) {
@@ -1395,6 +1539,11 @@
     font-size: 12px;
   }
 }
+.\[\&\:\:-webkit-scrollbar\]\:hidden {
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}
 @keyframes load8 {
   0% {
     transform: rotate(0deg);
@@ -1529,6 +1678,10 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-tracking {
+  syntax: "*";
+  inherits: false;
+}
 @property --tw-ordinal {
   syntax: "*";
   inherits: false;
@@ -1549,6 +1702,71 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-inset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-ring-inset {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-offset-width {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0px;
+}
+@property --tw-ring-offset-color {
+  syntax: "*";
+  inherits: false;
+  initial-value: #fff;
+}
+@property --tw-ring-offset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
 @property --tw-outline-style {
   syntax: "*";
   inherits: false;
@@ -1676,11 +1894,26 @@
       --tw-border-style: solid;
       --tw-leading: initial;
       --tw-font-weight: initial;
+      --tw-tracking: initial;
       --tw-ordinal: initial;
       --tw-slashed-zero: initial;
       --tw-numeric-figure: initial;
       --tw-numeric-spacing: initial;
       --tw-numeric-fraction: initial;
+      --tw-shadow: 0 0 #0000;
+      --tw-shadow-color: initial;
+      --tw-shadow-alpha: 100%;
+      --tw-inset-shadow: 0 0 #0000;
+      --tw-inset-shadow-color: initial;
+      --tw-inset-shadow-alpha: 100%;
+      --tw-ring-color: initial;
+      --tw-ring-shadow: 0 0 #0000;
+      --tw-inset-ring-color: initial;
+      --tw-inset-ring-shadow: 0 0 #0000;
+      --tw-ring-inset: initial;
+      --tw-ring-offset-width: 0px;
+      --tw-ring-offset-color: #fff;
+      --tw-ring-offset-shadow: 0 0 #0000;
       --tw-outline-style: solid;
       --tw-blur: initial;
       --tw-brightness: initial;