@alfalab/core-components-page-indicator 2.0.0 → 2.1.0-snapshot-92b8690

package/components/bullet/default.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color: var(--color-light-neutral-translucent-300);
     --page-indicator-active-color: var(--color-light-neutral-translucent-1300);
-} .page-indicator__element_100b4 {
+} .page-indicator__element_1vzr8 {
     background: var(--page-indicator-color)
-} .page-indicator__element_100b4.page-indicator__active_100b4 {
+} .page-indicator__element_1vzr8.page-indicator__active_1vzr8 {
         background: var(--page-indicator-active-color);
     }

package/components/bullet/default.module.css.js

@@ -2,7 +2,7 @@
 
 require('./default.css');
 
-var defaultColors = {"element":"page-indicator__element_100b4","active":"page-indicator__active_100b4"};
+var defaultColors = {"element":"page-indicator__element_1vzr8","active":"page-indicator__active_1vzr8"};
 
 module.exports = defaultColors;
 //# sourceMappingURL=default.module.css.js.map

package/components/bullet/index.css

@@ -3,9 +3,9 @@
 } :root {
     --page-indicator-animation-duration: 0.2s;
     --page-indicator-animation-timing-function: ease-in-out;
-} .page-indicator__pageIndicator_gavq3.page-indicator__bullet_gavq3 {
+} .page-indicator__pageIndicator_njn6x.page-indicator__bullet_njn6x {
         overflow: hidden;
-    } .page-indicator__elementsList_gavq3 {
+    } .page-indicator__elementsList_njn6x {
     margin: 0;
     padding: 0;
     display: flex;
@@ -13,22 +13,22 @@
     will-change: transform;
     transition: transform var(--page-indicator-animation-duration)
         var(--page-indicator-animation-timing-function);
-} .page-indicator__element_gavq3 {
+} .page-indicator__element_njn6x {
     list-style-type: none;
     flex-shrink: 0;
     transition: background var(--page-indicator-animation-duration)
         var(--page-indicator-animation-timing-function);
     border-radius: var(--border-radius-circle)
-} .page-indicator__element_gavq3.page-indicator__entering_gavq3 {
+} .page-indicator__element_njn6x.page-indicator__entering_njn6x {
         opacity: 0;
-    } .page-indicator__element_gavq3.page-indicator__entered_gavq3 {
+    } .page-indicator__element_njn6x.page-indicator__entered_njn6x {
         opacity: 1;
         transition: background var(--page-indicator-animation-duration)
                 var(--page-indicator-animation-timing-function),
             opacity var(--page-indicator-animation-duration)
                 var(--page-indicator-animation-timing-function);
-    } .page-indicator__element_gavq3.page-indicator__exiting_gavq3 {
+    } .page-indicator__element_njn6x.page-indicator__exiting_njn6x {
         opacity: 0;
-    } .page-indicator__element_gavq3.page-indicator__exited_gavq3 {
+    } .page-indicator__element_njn6x.page-indicator__exited_njn6x {
         opacity: 0;
     }

package/components/bullet/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"pageIndicator":"page-indicator__pageIndicator_gavq3","bullet":"page-indicator__bullet_gavq3","elementsList":"page-indicator__elementsList_gavq3","element":"page-indicator__element_gavq3","entering":"page-indicator__entering_gavq3","entered":"page-indicator__entered_gavq3","exiting":"page-indicator__exiting_gavq3","exited":"page-indicator__exited_gavq3"};
+var styles = {"pageIndicator":"page-indicator__pageIndicator_njn6x","bullet":"page-indicator__bullet_njn6x","elementsList":"page-indicator__elementsList_njn6x","element":"page-indicator__element_njn6x","entering":"page-indicator__entering_njn6x","entered":"page-indicator__entered_njn6x","exiting":"page-indicator__exiting_njn6x","exited":"page-indicator__exited_njn6x"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/bullet/inverted.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-inverted: var(--color-light-neutral-translucent-300-inverted);
     --page-indicator-active-color-inverted: var(--color-light-neutral-translucent-1300-inverted);
-} .page-indicator__element_1bp1t {
+} .page-indicator__element_4a7ue {
     background: var(--page-indicator-color-inverted)
-} .page-indicator__element_1bp1t.page-indicator__active_1bp1t {
+} .page-indicator__element_4a7ue.page-indicator__active_4a7ue {
         background: var(--page-indicator-active-color-inverted);
     }

package/components/bullet/inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./inverted.css');
 
-var invertedColors = {"element":"page-indicator__element_1bp1t","active":"page-indicator__active_1bp1t"};
+var invertedColors = {"element":"page-indicator__element_4a7ue","active":"page-indicator__active_4a7ue"};
 
 module.exports = invertedColors;
 //# sourceMappingURL=inverted.module.css.js.map

package/components/bullet/static-inverted.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-static-inverted: var(--color-static-neutral-translucent-300-inverted);
     --page-indicator-active-color-static-inverted: var(--color-static-neutral-1300-inverted);
-} .page-indicator__element_1lilh {
+} .page-indicator__element_ovghj {
     background: var(--page-indicator-color-static-inverted)
-} .page-indicator__element_1lilh.page-indicator__active_1lilh {
+} .page-indicator__element_ovghj.page-indicator__active_ovghj {
         background: var(--page-indicator-active-color-static-inverted);
     }

package/components/bullet/static-inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static-inverted.css');
 
-var staticInvertedColors = {"element":"page-indicator__element_1lilh","active":"page-indicator__active_1lilh"};
+var staticInvertedColors = {"element":"page-indicator__element_ovghj","active":"page-indicator__active_ovghj"};
 
 module.exports = staticInvertedColors;
 //# sourceMappingURL=static-inverted.module.css.js.map

package/components/bullet/static.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-static: var(--color-static-neutral-translucent-300);
     --page-indicator-active-color-static: var(--color-static-neutral-1300);
-} .page-indicator__element_1fnmi {
+} .page-indicator__element_14pcw {
     background: var(--page-indicator-color-static)
-} .page-indicator__element_1fnmi.page-indicator__active_1fnmi {
+} .page-indicator__element_14pcw.page-indicator__active_14pcw {
         background: var(--page-indicator-active-color-static);
     }

package/components/bullet/static.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static.css');
 
-var staticColors = {"element":"page-indicator__element_1fnmi","active":"page-indicator__active_1fnmi"};
+var staticColors = {"element":"page-indicator__element_14pcw","active":"page-indicator__active_14pcw"};
 
 module.exports = staticColors;
 //# sourceMappingURL=static.module.css.js.map

package/components/dynamic/default.css

@@ -4,10 +4,10 @@
 } :root {
     --page-indicator-color: var(--color-light-neutral-translucent-300);
     --page-indicator-active-color: var(--color-light-neutral-translucent-1300);
-} .page-indicator__element_1yd19 {
+} .page-indicator__element_i0lj0 {
     background: var(--page-indicator-color)
-} .page-indicator__element_1yd19.page-indicator__active_1yd19 {
-        .page-indicator__progress_1yd19 {
+} .page-indicator__element_i0lj0.page-indicator__active_i0lj0 {
+        .page-indicator__progress_i0lj0 {
             background: var(--page-indicator-active-color);
         }
     }

package/components/dynamic/default.module.css.js

@@ -2,7 +2,7 @@
 
 require('./default.css');
 
-var defaultColors = {"element":"page-indicator__element_1yd19","active":"page-indicator__active_1yd19","progress":"page-indicator__progress_1yd19"};
+var defaultColors = {"element":"page-indicator__element_i0lj0","active":"page-indicator__active_i0lj0","progress":"page-indicator__progress_i0lj0"};
 
 module.exports = defaultColors;
 //# sourceMappingURL=default.module.css.js.map

package/components/dynamic/index.css

@@ -1,20 +1,20 @@
 :root {
     --page-indicator-animation-duration: 0.2s;
-} .page-indicator__pageIndicator_ffjjc {
+} .page-indicator__pageIndicator_2wroe {
     margin: 0;
     padding: 0;
     display: flex;
-} .page-indicator__element_ffjjc {
+} .page-indicator__element_2wroe {
     list-style-type: none;
     overflow: hidden;
     transition: width var(--page-indicator-animation-duration) linear
-} .page-indicator__element_ffjjc:not(.page-indicator__active_ffjjc) {
-        .page-indicator__progress_ffjjc {
+} .page-indicator__element_2wroe:not(.page-indicator__active_2wroe) {
+        .page-indicator__progress_2wroe {
             display: none;
         }
-    } .page-indicator__element_ffjjc {
+    } .page-indicator__element_2wroe {
 
-    .page-indicator__progress_ffjjc {
+    .page-indicator__progress_2wroe {
         width: 100%;
         height: 100%;
         will-change: transform;

package/components/dynamic/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"pageIndicator":"page-indicator__pageIndicator_ffjjc","element":"page-indicator__element_ffjjc","active":"page-indicator__active_ffjjc","progress":"page-indicator__progress_ffjjc"};
+var styles = {"pageIndicator":"page-indicator__pageIndicator_2wroe","element":"page-indicator__element_2wroe","active":"page-indicator__active_2wroe","progress":"page-indicator__progress_2wroe"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/dynamic/inverted.css

@@ -4,10 +4,10 @@
 } :root {
     --page-indicator-color-inverted: var(--color-light-neutral-translucent-300-inverted);
     --page-indicator-active-color-inverted: var(--color-light-neutral-translucent-1300-inverted);
-} .page-indicator__element_5rm4m {
+} .page-indicator__element_1fubh {
     background: var(--page-indicator-color-inverted)
-} .page-indicator__element_5rm4m.page-indicator__active_5rm4m {
-        .page-indicator__progress_5rm4m {
+} .page-indicator__element_1fubh.page-indicator__active_1fubh {
+        .page-indicator__progress_1fubh {
             background: var(--page-indicator-active-color-inverted);
         }
     }

package/components/dynamic/inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./inverted.css');
 
-var invertedColors = {"element":"page-indicator__element_5rm4m","active":"page-indicator__active_5rm4m","progress":"page-indicator__progress_5rm4m"};
+var invertedColors = {"element":"page-indicator__element_1fubh","active":"page-indicator__active_1fubh","progress":"page-indicator__progress_1fubh"};
 
 module.exports = invertedColors;
 //# sourceMappingURL=inverted.module.css.js.map

package/components/dynamic/static-inverted.css

@@ -4,10 +4,10 @@
 } :root {
     --page-indicator-color-static-inverted: var(--color-static-neutral-translucent-300-inverted);
     --page-indicator-active-color-static-inverted: var(--color-static-neutral-1300-inverted);
-} .page-indicator__element_1adrr {
+} .page-indicator__element_pcvzh {
     background: var(--page-indicator-color-static-inverted)
-} .page-indicator__element_1adrr.page-indicator__active_1adrr {
-        .page-indicator__progress_1adrr {
+} .page-indicator__element_pcvzh.page-indicator__active_pcvzh {
+        .page-indicator__progress_pcvzh {
             background: var(--page-indicator-active-color-static-inverted);
         }
     }

package/components/dynamic/static-inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static-inverted.css');
 
-var staticInvertedColors = {"element":"page-indicator__element_1adrr","active":"page-indicator__active_1adrr","progress":"page-indicator__progress_1adrr"};
+var staticInvertedColors = {"element":"page-indicator__element_pcvzh","active":"page-indicator__active_pcvzh","progress":"page-indicator__progress_pcvzh"};
 
 module.exports = staticInvertedColors;
 //# sourceMappingURL=static-inverted.module.css.js.map

package/components/dynamic/static.css

@@ -4,10 +4,10 @@
 } :root {
     --page-indicator-color-static: var(--color-static-neutral-translucent-300);
     --page-indicator-active-color-static: var(--color-static-neutral-1300);
-} .page-indicator__element_19j1z {
+} .page-indicator__element_psa9s {
     background: var(--page-indicator-color-static)
-} .page-indicator__element_19j1z.page-indicator__active_19j1z {
-        .page-indicator__progress_19j1z {
+} .page-indicator__element_psa9s.page-indicator__active_psa9s {
+        .page-indicator__progress_psa9s {
             background: var(--page-indicator-active-color-static);
         }
     }

package/components/dynamic/static.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static.css');
 
-var staticColors = {"element":"page-indicator__element_19j1z","active":"page-indicator__active_19j1z","progress":"page-indicator__progress_19j1z"};
+var staticColors = {"element":"page-indicator__element_psa9s","active":"page-indicator__active_psa9s","progress":"page-indicator__progress_psa9s"};
 
 module.exports = staticColors;
 //# sourceMappingURL=static.module.css.js.map

package/components/runner/default.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color: var(--color-light-neutral-translucent-300);
     --page-indicator-active-color: var(--color-light-neutral-translucent-1300);
-} .page-indicator__pageIndicator_u3qk5 {
+} .page-indicator__pageIndicator_1igae {
     background: var(--page-indicator-color);
-} .page-indicator__element_u3qk5 {
+} .page-indicator__element_1igae {
     background: var(--page-indicator-active-color);
 }

package/components/runner/default.module.css.js

@@ -2,7 +2,7 @@
 
 require('./default.css');
 
-var defaultColors = {"pageIndicator":"page-indicator__pageIndicator_u3qk5","element":"page-indicator__element_u3qk5"};
+var defaultColors = {"pageIndicator":"page-indicator__pageIndicator_1igae","element":"page-indicator__element_1igae"};
 
 module.exports = defaultColors;
 //# sourceMappingURL=default.module.css.js.map

package/components/runner/index.css

@@ -1,6 +1,6 @@
 :root {
     --page-indicator-animation-duration: 0.2s;
-} .page-indicator__element_pgu2k {
+} .page-indicator__element_io4zk {
     transition: transform var(--page-indicator-animation-duration) linear;
     will-change: transition;
 }

package/components/runner/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"element":"page-indicator__element_pgu2k"};
+var styles = {"element":"page-indicator__element_io4zk"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/runner/inverted.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-inverted: var(--color-light-neutral-translucent-300-inverted);
     --page-indicator-active-color-inverted: var(--color-light-neutral-translucent-1300-inverted);
-} .page-indicator__pageIndicator_ygppt {
+} .page-indicator__pageIndicator_vyemm {
     background: var(--page-indicator-color-inverted);
-} .page-indicator__element_ygppt {
+} .page-indicator__element_vyemm {
     background: var(--page-indicator-active-color-inverted);
 }

package/components/runner/inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./inverted.css');
 
-var invertedColors = {"pageIndicator":"page-indicator__pageIndicator_ygppt","element":"page-indicator__element_ygppt"};
+var invertedColors = {"pageIndicator":"page-indicator__pageIndicator_vyemm","element":"page-indicator__element_vyemm"};
 
 module.exports = invertedColors;
 //# sourceMappingURL=inverted.module.css.js.map

package/components/runner/static-inverted.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-static-inverted: var(--color-static-neutral-translucent-300-inverted);
     --page-indicator-active-color-static-inverted: var(--color-static-neutral-1300-inverted);
-} .page-indicator__pageIndicator_2z7c0 {
+} .page-indicator__pageIndicator_vnxuf {
     background: var(--page-indicator-color-static-inverted);
-} .page-indicator__element_2z7c0 {
+} .page-indicator__element_vnxuf {
     background: var(--page-indicator-active-color-static-inverted);
 }

package/components/runner/static-inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static-inverted.css');
 
-var staticInvertedColors = {"pageIndicator":"page-indicator__pageIndicator_2z7c0","element":"page-indicator__element_2z7c0"};
+var staticInvertedColors = {"pageIndicator":"page-indicator__pageIndicator_vnxuf","element":"page-indicator__element_vnxuf"};
 
 module.exports = staticInvertedColors;
 //# sourceMappingURL=static-inverted.module.css.js.map

package/components/runner/static.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-static: var(--color-static-neutral-translucent-300);
     --page-indicator-active-color-static: var(--color-static-neutral-1300);
-} .page-indicator__pageIndicator_1stjd {
+} .page-indicator__pageIndicator_1hakt {
     background: var(--page-indicator-color-static);
-} .page-indicator__element_1stjd {
+} .page-indicator__element_1hakt {
     background: var(--page-indicator-active-color-static);
 }

package/components/runner/static.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static.css');
 
-var staticColors = {"pageIndicator":"page-indicator__pageIndicator_1stjd","element":"page-indicator__element_1stjd"};
+var staticColors = {"pageIndicator":"page-indicator__pageIndicator_1hakt","element":"page-indicator__element_1hakt"};
 
 module.exports = staticColors;
 //# sourceMappingURL=static.module.css.js.map

package/components/step/default.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color: var(--color-light-neutral-translucent-300);
     --page-indicator-active-color: var(--color-light-neutral-translucent-1300);
-} .page-indicator__element_1mjvw {
+} .page-indicator__element_uekm2 {
     background: var(--page-indicator-color)
-} .page-indicator__element_1mjvw.page-indicator__active_1mjvw {
+} .page-indicator__element_uekm2.page-indicator__active_uekm2 {
         background: var(--page-indicator-active-color);
     }

package/components/step/default.module.css.js

@@ -2,7 +2,7 @@
 
 require('./default.css');
 
-var defaultColors = {"element":"page-indicator__element_1mjvw","active":"page-indicator__active_1mjvw"};
+var defaultColors = {"element":"page-indicator__element_uekm2","active":"page-indicator__active_uekm2"};
 
 module.exports = defaultColors;
 //# sourceMappingURL=default.module.css.js.map

package/components/step/index.css

@@ -1,11 +1,11 @@
 :root {
     --page-indicator-animation-duration: 0.2s;
     --page-indicator-animation-timing-function: ease-in-out;
-} .page-indicator__pageIndicator_7ftuq {
+} .page-indicator__pageIndicator_3kxjq {
     margin: 0;
     padding: 0;
     display: flex;
-} .page-indicator__element_7ftuq {
+} .page-indicator__element_3kxjq {
     list-style-type: none;
     flex-grow: 1;
     transition: backgroud var(--page-indicator-animation-duration)

package/components/step/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"pageIndicator":"page-indicator__pageIndicator_7ftuq","element":"page-indicator__element_7ftuq"};
+var styles = {"pageIndicator":"page-indicator__pageIndicator_3kxjq","element":"page-indicator__element_3kxjq"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/step/inverted.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-inverted: var(--color-light-neutral-translucent-300-inverted);
     --page-indicator-active-color-inverted: var(--color-light-neutral-translucent-1300-inverted);
-} .page-indicator__element_1ml63 {
+} .page-indicator__element_le4lr {
     background: var(--page-indicator-color-inverted)
-} .page-indicator__element_1ml63.page-indicator__active_1ml63 {
+} .page-indicator__element_le4lr.page-indicator__active_le4lr {
         background: var(--page-indicator-active-color-inverted);
     }

package/components/step/inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./inverted.css');
 
-var invertedColors = {"element":"page-indicator__element_1ml63","active":"page-indicator__active_1ml63"};
+var invertedColors = {"element":"page-indicator__element_le4lr","active":"page-indicator__active_le4lr"};
 
 module.exports = invertedColors;
 //# sourceMappingURL=inverted.module.css.js.map

package/components/step/static-inverted.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-static-inverted: var(--color-static-neutral-translucent-300-inverted);
     --page-indicator-active-color-static-inverted: var(--color-static-neutral-1300-inverted);
-} .page-indicator__element_1q1k0 {
+} .page-indicator__element_1isff {
     background: var(--page-indicator-color-static-inverted)
-} .page-indicator__element_1q1k0.page-indicator__active_1q1k0 {
+} .page-indicator__element_1isff.page-indicator__active_1isff {
         background: var(--page-indicator-active-color-static-inverted);
     }

package/components/step/static-inverted.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static-inverted.css');
 
-var staticInvertedColors = {"element":"page-indicator__element_1q1k0","active":"page-indicator__active_1q1k0"};
+var staticInvertedColors = {"element":"page-indicator__element_1isff","active":"page-indicator__active_1isff"};
 
 module.exports = staticInvertedColors;
 //# sourceMappingURL=static-inverted.module.css.js.map

package/components/step/static.css

@@ -4,8 +4,8 @@
 } :root {
     --page-indicator-color-static: var(--color-static-neutral-translucent-300);
     --page-indicator-active-color-static: var(--color-static-neutral-1300);
-} .page-indicator__element_13y6c {
+} .page-indicator__element_1ivs4 {
     background: var(--page-indicator-color-static)
-} .page-indicator__element_13y6c.page-indicator__active_13y6c {
+} .page-indicator__element_1ivs4.page-indicator__active_1ivs4 {
         background: var(--page-indicator-active-color-static);
     }

package/components/step/static.module.css.js

@@ -2,7 +2,7 @@
 
 require('./static.css');
 
-var staticColors = {"element":"page-indicator__element_13y6c","active":"page-indicator__active_13y6c"};
+var staticColors = {"element":"page-indicator__element_1ivs4","active":"page-indicator__active_1ivs4"};
 
 module.exports = staticColors;
 //# sourceMappingURL=static.module.css.js.map

package/dynamic-mixins/Component.d.ts

@@ -0,0 +1,5 @@
+export { PageIndicatorBullet } from './components/bullet';
+export { PageIndicatorDynamic } from './components/dynamic';
+export { PageIndicatorRunner } from './components/runner';
+export { PageIndicatorStep } from './components/step';
+export * from './types';

package/dynamic-mixins/Component.js

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Component = require('./components/bullet/Component.js');
+var Component$1 = require('./components/dynamic/Component.js');
+var Component$2 = require('./components/runner/Component.js');
+var Component$3 = require('./components/step/Component.js');
+
+
+
+exports.PageIndicatorBullet = Component.PageIndicatorBullet;
+exports.PageIndicatorDynamic = Component$1.PageIndicatorDynamic;
+exports.PageIndicatorRunner = Component$2.PageIndicatorRunner;
+exports.PageIndicatorStep = Component$3.PageIndicatorStep;
+//# sourceMappingURL=Component.js.map

package/dynamic-mixins/Component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Component.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dynamic-mixins/components/bullet/Component.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { PageIndicatorBulletProps } from '../../types';
+export declare const PageIndicatorBullet: FC<PageIndicatorBulletProps>;

package/dynamic-mixins/components/bullet/Component.js

@@ -0,0 +1,55 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var reactTransitionGroup = require('react-transition-group');
+var cn = require('classnames');
+var utils = require('./utils/utils.js');
+var default_module = require('./default.module.css.js');
+var index_module = require('./index.module.css.js');
+var inverted_module = require('./inverted.module.css.js');
+var static_module = require('./static.module.css.js');
+var staticInverted_module = require('./static-inverted.module.css.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var colorsStyle = {
+    inverted: inverted_module,
+    default: default_module,
+    static: static_module,
+    'static-inverted': staticInverted_module,
+};
+var transitionClassess = {};
+var PageIndicatorBullet = function (_a) {
+    var _b = _a.elements, count = _b === void 0 ? 10 : _b, activeElementIndex = _a.activeElement, _c = _a.size, size = _c === void 0 ? 8 : _c, _d = _a.gap, gap = _d === void 0 ? 8 : _d, _e = _a.colors, colors = _e === void 0 ? 'default' : _e;
+    var refs = React.useMemo(function () { return Array.from({ length: count }, function () { return React.createRef(); }); }, [count]);
+    var _f = React.useMemo(function () { return utils.calcParams(size, gap, activeElementIndex, count); }, [activeElementIndex, count, gap, size]), height = _f[0], width = _f[1], offset = _f[2], elementSize = _f[3], firstVisibleElementIndex = _f[4], lastVisibleElementIndex = _f[5];
+    return (React__default.default.createElement("div", { className: cn__default.default(index_module.pageIndicator, index_module.bullet), style: { height: height, width: width } },
+        React__default.default.createElement("ol", { className: index_module.elementsList, style: { gap: gap, transform: "translate(".concat(offset, "px)") } }, refs.map(function (ref, index) {
+            var sizeOfElement = elementSize(index);
+            var isActive = activeElementIndex === index;
+            var isVisible = firstVisibleElementIndex <= index && index <= lastVisibleElementIndex;
+            var addListTransitionEndListener = function (done) {
+                var _a;
+                var parentElement = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.parentElement;
+                parentElement === null || parentElement === void 0 ? void 0 : parentElement.addEventListener('transitionend', done, { once: true });
+            };
+            return (React__default.default.createElement(reactTransitionGroup.CSSTransition
+            // eslint-disable-next-line react/no-array-index-key
+            , { 
+                // eslint-disable-next-line react/no-array-index-key
+                key: index, nodeRef: ref, addEndListener: addListTransitionEndListener, in: isVisible, 
+                // passed empty object so any classes aren't added
+                classNames: transitionClassess }, function (status) {
+                var _a;
+                return (React__default.default.createElement("li", { ref: ref, "data-index": index, className: cn__default.default(index_module.element, colorsStyle[colors].element, (_a = {}, _a[colorsStyle[colors].active] = isActive, _a), index_module[status]), style: { height: sizeOfElement, width: sizeOfElement } }));
+            }));
+        }))));
+};
+
+exports.PageIndicatorBullet = PageIndicatorBullet;
+//# sourceMappingURL=Component.js.map

package/dynamic-mixins/components/bullet/Component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Component.js","sources":["../../../src/components/bullet/Component.tsx"],"sourcesContent":["import React, { createRef, FC, useMemo } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport cn from 'classnames';\n\nimport { PageIndicatorBulletProps } from '../../types';\n\nimport { calcParams } from './utils';\n\nimport defaultColors from './default.module.css';\nimport styles from './index.module.css';\nimport invertedColors from './inverted.module.css';\nimport staticColors from './static.module.css';\nimport staticInvertedColors from './static-inverted.module.css';\n\nconst colorsStyle = {\n    inverted: invertedColors,\n    default: defaultColors,\n    static: staticColors,\n    'static-inverted': staticInvertedColors,\n} as const;\n\nconst transitionClassess = {} as const;\n\nexport const PageIndicatorBullet: FC<PageIndicatorBulletProps> = ({\n    elements: count = 10,\n    activeElement: activeElementIndex,\n    size = 8,\n    gap = 8,\n    colors = 'default',\n}) => {\n    const refs = useMemo(\n        () => Array.from({ length: count }, () => createRef<HTMLLIElement>()),\n        [count],\n    );\n    const [height, width, offset, elementSize, firstVisibleElementIndex, lastVisibleElementIndex] =\n        useMemo(\n            () => calcParams(size, gap, activeElementIndex, count),\n            [activeElementIndex, count, gap, size],\n        );\n\n    return (\n        <div className={cn(styles.pageIndicator, styles.bullet)} style={{ height, width }}>\n            <ol\n                className={styles.elementsList}\n                style={{ gap, transform: `translate(${offset}px)` }}\n            >\n                {refs.map((ref, index) => {\n                    const sizeOfElement = elementSize(index);\n                    const isActive = activeElementIndex === index;\n                    const isVisible =\n                        firstVisibleElementIndex <= index && index <= lastVisibleElementIndex;\n                    const addListTransitionEndListener = (done: () => void) => {\n                        const parentElement = ref.current?.parentElement;\n\n                        parentElement?.addEventListener('transitionend', done, { once: true });\n                    };\n\n                    return (\n                        <CSSTransition\n                            // eslint-disable-next-line react/no-array-index-key\n                            key={index}\n                            nodeRef={ref}\n                            addEndListener={addListTransitionEndListener}\n                            in={isVisible}\n                            // passed empty object so any classes aren't added\n                            classNames={transitionClassess}\n                        >\n                            {(status) => (\n                                <li\n                                    ref={ref}\n                                    data-index={index}\n                                    className={cn(\n                                        styles.element,\n                                        colorsStyle[colors].element,\n                                        { [colorsStyle[colors].active]: isActive },\n                                        styles[status],\n                                    )}\n                                    style={{ height: sizeOfElement, width: sizeOfElement }}\n                                />\n                            )}\n                        </CSSTransition>\n                    );\n                })}\n            </ol>\n        </div>\n    );\n};\n"],"names":["invertedColors","defaultColors","staticColors","staticInvertedColors","useMemo","createRef","calcParams","React","cn","styles","CSSTransition"],"mappings":"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"}