hplx-react-elements-dev 1.1.2 → 1.1.4

package/dist/esm/carousel/imageCarousel.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { CarouselProps } from "../types";
+import "../carousel/imageCarousel.css";
+declare const ImageCarousel: ({ imageList, isNextPrev, caroselLeftIcon, caroselRightIcon, timeInterval, autoPlay, carouselIndicator }: CarouselProps) => JSX.Element;
+export default ImageCarousel;

package/dist/esm/index.css

@@ -1540,3 +1540,81 @@
   color: #849095;
   padding: 0.833em;
 }
+
+.slider {
+  position: relative;
+}
+
+.image {
+  width: 100%;
+}
+
+.right-arrow {
+  position: absolute;
+  top: 50%;
+  right: 32px;
+  font-size: 2rem;
+  color: #fff;
+  z-index: 10;
+  cursor: pointer;
+  -webkit-user-select: none;
+          user-select: none;
+  background: rgba(0, 0, 0, 0.2);
+  opacity: 0.2;
+  border-radius: 50%;
+  width: 50px;
+  height: 50px;
+  text-align: center;
+}
+
+.left-arrow {
+  position: absolute;
+  top: 50%;
+  left: 32px;
+  font-size: 2rem;
+  color: #fff;
+  z-index: 10;
+  cursor: pointer;
+  -webkit-user-select: none;
+          user-select: none;
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 50%;
+  width: 50px;
+  height: 50px;
+  text-align: center;
+}
+.left-arrow:hover,
+.right-arrow:hover {
+  background: rgba(0, 0, 0, 0.8);
+}
+
+.slide {
+  opacity: 0;
+  transition-duration: 2s;
+  transition-timing-function: ease;
+}
+
+.slide.active {
+  opacity: 1;
+  transition-duration: 1s;
+  transform: scale(1);
+}
+.carousel-indicators li {
+  width: 10px;
+  height: 10px;
+  border-radius: 100%;
+  float: left;
+  background: rgba(255, 255, 255, 0.5);
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  margin: 0px 5px;
+  cursor: pointer;
+}
+.carousel-indicators li.active {
+  background: #fff;
+  border: 1px solid #fff;
+}
+.carousel-indicators {
+  position: absolute;
+  left: 50%;
+  bottom: 5%;
+}

package/dist/esm/index.d.ts

@@ -29,3 +29,5 @@ export { default as DoubleInput } from "./doubleInput/DoubleInput";
 export { default as InputTag } from "./inputTag/InputTag";
 export { default as InputTagDropdownItem } from "./inputTag/InputTagDropdownItem";
 export { default as CalendarView } from "./calendarView/CalendarView";
+export { default as PopUpModal } from "./popUpModal/PopUpModal";
+export { default as ImageCarousel } from "./carousel/imageCarousel";