@x-plat/design-system 0.3.0 → 0.3.2

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.
package/dist/index.css CHANGED
@@ -2703,6 +2703,77 @@ h2.react-datepicker__current-month {
2703
2703
  color: var(--xplat-neutral-300);
2704
2704
  }
2705
2705
 
2706
+ /* src/components/Swiper/swiper.scss */
2707
+ .lib-xplat-swiper {
2708
+ width: 100%;
2709
+ position: relative;
2710
+ }
2711
+ .lib-xplat-swiper__viewport {
2712
+ overflow: hidden;
2713
+ cursor: grab;
2714
+ user-select: none;
2715
+ }
2716
+ .lib-xplat-swiper__viewport:active {
2717
+ cursor: grabbing;
2718
+ }
2719
+ .lib-xplat-swiper__track {
2720
+ display: flex;
2721
+ will-change: transform;
2722
+ }
2723
+ .lib-xplat-swiper__track.transitioning {
2724
+ transition-property: transform;
2725
+ transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
2726
+ }
2727
+ .lib-xplat-swiper__slide {
2728
+ flex-shrink: 0;
2729
+ overflow: hidden;
2730
+ }
2731
+ .lib-xplat-swiper__progress {
2732
+ margin-top: 1rem;
2733
+ display: flex;
2734
+ justify-content: center;
2735
+ }
2736
+ .lib-xplat-swiper__progress-track {
2737
+ position: relative;
2738
+ width: 100%;
2739
+ max-width: 580px;
2740
+ height: 2px;
2741
+ background-color: var(--xplat-neutral-200);
2742
+ border-radius: 1px;
2743
+ }
2744
+ .lib-xplat-swiper__progress-fill {
2745
+ position: absolute;
2746
+ top: 0;
2747
+ left: 0;
2748
+ height: 100%;
2749
+ background-color: var(--xplat-neutral-500);
2750
+ border-radius: 1px;
2751
+ transition-property: width;
2752
+ transition-timing-function: ease;
2753
+ }
2754
+ .lib-xplat-swiper__dots {
2755
+ display: flex;
2756
+ justify-content: center;
2757
+ gap: 6px;
2758
+ margin-top: 1rem;
2759
+ }
2760
+ .lib-xplat-swiper__dot {
2761
+ width: 8px;
2762
+ height: 8px;
2763
+ border-radius: 50%;
2764
+ border: none;
2765
+ padding: 0;
2766
+ cursor: pointer;
2767
+ background-color: var(--xplat-neutral-300);
2768
+ transition: background-color 0.2s;
2769
+ }
2770
+ .lib-xplat-swiper__dot.active {
2771
+ background-color: var(--xplat-neutral-700);
2772
+ }
2773
+ .lib-xplat-swiper__dot:hover:not(.active) {
2774
+ background-color: var(--xplat-neutral-400);
2775
+ }
2776
+
2706
2777
  /* src/components/Switch/switch.scss */
2707
2778
  .lib-xplat-switch {
2708
2779
  position: relative;
package/dist/index.d.cts CHANGED
@@ -27,6 +27,7 @@ export { Radio, RadioGroup } from './components/Radio/index.cjs';
27
27
  export { Skeleton } from './components/Skeleton/index.cjs';
28
28
  export { Spinner } from './components/Spinner/index.cjs';
29
29
  export { Steps } from './components/Steps/index.cjs';
30
+ export { Swiper, SwiperHandle, SwiperProps } from './components/Swiper/index.cjs';
30
31
  export { Switch } from './components/Switch/index.cjs';
31
32
  export { Tab } from './components/Tab/index.cjs';
32
33
  export { Table, TableBody, TableCell, TableHead, TableRow } from './components/Table/index.cjs';
package/dist/index.d.ts CHANGED
@@ -27,6 +27,7 @@ export { Radio, RadioGroup } from './components/Radio/index.js';
27
27
  export { Skeleton } from './components/Skeleton/index.js';
28
28
  export { Spinner } from './components/Spinner/index.js';
29
29
  export { Steps } from './components/Steps/index.js';
30
+ export { Swiper, SwiperHandle, SwiperProps } from './components/Swiper/index.js';
30
31
  export { Switch } from './components/Switch/index.js';
31
32
  export { Tab } from './components/Tab/index.js';
32
33
  export { Table, TableBody, TableCell, TableHead, TableRow } from './components/Table/index.js';