@studiometa/ui 0.1.1 → 0.2.2

package/molecules/Slider/SliderBtn.cjs

@@ -0,0 +1,65 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// packages/ui/molecules/Slider/SliderBtn.js
+var SliderBtn_exports = {};
+__export(SliderBtn_exports, {
+  default: () => SliderBtn
+});
+var import_AbstractSliderChild = __toESM(require("./AbstractSliderChild.cjs"), 1);
+var SliderBtn = class extends import_AbstractSliderChild.default {
+  update(index) {
+    if (index === 0 && this.$options.prev || index === this.$parent.indexMax && this.$options.next) {
+      this.$el.setAttribute("disabled", "");
+    } else {
+      this.$el.removeAttribute("disabled");
+    }
+  }
+  onClick() {
+    const { prev, next } = this.$options;
+    if (prev) {
+      this.$parent.goPrev();
+    } else if (next) {
+      this.$parent.goNext();
+    }
+  }
+};
+__publicField(SliderBtn, "config", {
+  name: "SliderBtn",
+  options: {
+    prev: Boolean,
+    next: Boolean
+  }
+});
+module.exports = __toCommonJS(SliderBtn_exports);
+if (module.exports.default) module.exports = module.exports.default;

package/molecules/Slider/SliderBtn.d.ts

@@ -0,0 +1,31 @@
+/**
+ * @typedef {SliderBtn & {
+ *   $parent: import('./Slider.js').default
+ * }} SliderBtnInterface
+ */
+/**
+ * SliderBtn class.
+ */
+export default class SliderBtn extends AbstractSliderChild {
+    /**
+     * Config.
+     */
+    static config: {
+        name: string;
+        options: {
+            prev: BooleanConstructor;
+            next: BooleanConstructor;
+        };
+    };
+    /**
+     * Go prev or next on click.
+     *
+     * @this    {SliderBtnInterface}
+     * @returns {void}
+     */
+    onClick(): void;
+}
+export type SliderBtnInterface = SliderBtn & {
+    $parent: import('./Slider.js').default;
+};
+import AbstractSliderChild from "./AbstractSliderChild.js";

package/molecules/Slider/SliderBtn.js

@@ -0,0 +1,34 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import AbstractSliderChild from "./AbstractSliderChild.js";
+class SliderBtn extends AbstractSliderChild {
+  update(index) {
+    if (index === 0 && this.$options.prev || index === this.$parent.indexMax && this.$options.next) {
+      this.$el.setAttribute("disabled", "");
+    } else {
+      this.$el.removeAttribute("disabled");
+    }
+  }
+  onClick() {
+    const { prev, next } = this.$options;
+    if (prev) {
+      this.$parent.goPrev();
+    } else if (next) {
+      this.$parent.goNext();
+    }
+  }
+}
+__publicField(SliderBtn, "config", {
+  name: "SliderBtn",
+  options: {
+    prev: Boolean,
+    next: Boolean
+  }
+});
+export {
+  SliderBtn as default
+};

package/molecules/Slider/SliderCount.cjs

@@ -0,0 +1,50 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// packages/ui/molecules/Slider/SliderCount.js
+var SliderCount_exports = {};
+__export(SliderCount_exports, {
+  default: () => SliderCount
+});
+var import_AbstractSliderChild = __toESM(require("./AbstractSliderChild.cjs"), 1);
+var SliderCount = class extends import_AbstractSliderChild.default {
+  update(index) {
+    this.$refs.current.innerHTML = `${index + 1}`;
+  }
+};
+__publicField(SliderCount, "config", {
+  name: "SliderCount",
+  refs: ["current"]
+});
+module.exports = __toCommonJS(SliderCount_exports);
+if (module.exports.default) module.exports = module.exports.default;

package/molecules/Slider/SliderCount.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @typedef {SliderCount & { $refs: { current: HTMLElement } }} SliderCountInterface
+ */
+/**
+ * SliderCount class.
+ */
+export default class SliderCount extends AbstractSliderChild {
+    /**
+     * Config.
+     */
+    static config: {
+        name: string;
+        refs: string[];
+    };
+}
+export type SliderCountInterface = SliderCount & {
+    $refs: {
+        current: HTMLElement;
+    };
+};
+import AbstractSliderChild from "./AbstractSliderChild.js";

package/molecules/Slider/SliderCount.js

@@ -0,0 +1,19 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import AbstractSliderChild from "./AbstractSliderChild.js";
+class SliderCount extends AbstractSliderChild {
+  update(index) {
+    this.$refs.current.innerHTML = `${index + 1}`;
+  }
+}
+__publicField(SliderCount, "config", {
+  name: "SliderCount",
+  refs: ["current"]
+});
+export {
+  SliderCount as default
+};

package/molecules/Slider/SliderDots.cjs

@@ -0,0 +1,55 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// packages/ui/molecules/Slider/SliderDots.js
+var SliderDots_exports = {};
+__export(SliderDots_exports, {
+  default: () => SliderDots
+});
+var import_AbstractSliderChild = __toESM(require("./AbstractSliderChild.cjs"), 1);
+var SliderDots = class extends import_AbstractSliderChild.default {
+  update(index) {
+    this.$refs.dots.forEach((dot, i) => {
+      dot.classList.toggle("is-active", index === i);
+    });
+  }
+  onDotsClick(event, index) {
+    this.$parent.goTo(index);
+  }
+};
+__publicField(SliderDots, "config", {
+  name: "SliderDots",
+  refs: ["dots[]"]
+});
+module.exports = __toCommonJS(SliderDots_exports);
+if (module.exports.default) module.exports = module.exports.default;

package/molecules/Slider/SliderDots.d.ts

@@ -0,0 +1,33 @@
+/**
+ * @typedef {SliderDots & {
+ *   $refs: {
+ *     dots: HTMLButtonElement[],
+ *   }
+ * }} SliderDotsInterface
+ */
+/**
+ * SliderDots class.
+ */
+export default class SliderDots extends AbstractSliderChild {
+    /**
+     * Config.
+     */
+    static config: {
+        name: string;
+        refs: string[];
+    };
+    /**
+     * Go to the given index on dot click.
+     *
+     * @param   {MouseEvent} event
+     * @param   {number} index
+     * @returns {void}
+     */
+    onDotsClick(event: MouseEvent, index: number): void;
+}
+export type SliderDotsInterface = SliderDots & {
+    $refs: {
+        dots: HTMLButtonElement[];
+    };
+};
+import AbstractSliderChild from "./AbstractSliderChild.js";

package/molecules/Slider/SliderDots.js

@@ -0,0 +1,24 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import AbstractSliderChild from "./AbstractSliderChild.js";
+class SliderDots extends AbstractSliderChild {
+  update(index) {
+    this.$refs.dots.forEach((dot, i) => {
+      dot.classList.toggle("is-active", index === i);
+    });
+  }
+  onDotsClick(event, index) {
+    this.$parent.goTo(index);
+  }
+}
+__publicField(SliderDots, "config", {
+  name: "SliderDots",
+  refs: ["dots[]"]
+});
+export {
+  SliderDots as default
+};

package/molecules/Slider/SliderDrag.cjs

@@ -0,0 +1,45 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// packages/ui/molecules/Slider/SliderDrag.js
+var SliderDrag_exports = {};
+__export(SliderDrag_exports, {
+  default: () => SliderDrag
+});
+var import_js_toolkit = require("@studiometa/js-toolkit");
+var SliderDrag = class extends (0, import_js_toolkit.withDrag)(import_js_toolkit.Base) {
+  dragged(props) {
+    this.$emit(props.mode, props);
+  }
+};
+__publicField(SliderDrag, "config", {
+  name: "SliderDrag",
+  emits: ["start", "drag", "drop", "inertia", "stop"]
+});
+module.exports = __toCommonJS(SliderDrag_exports);
+if (module.exports.default) module.exports = module.exports.default;

package/molecules/Slider/SliderDrag.d.ts

@@ -0,0 +1,16 @@
+/**
+ * SliderDrag class.
+ */
+export default class SliderDrag extends Base {
+    static config: {
+        name: string;
+        emits: string[];
+    };
+    /**
+     * Emit drag events.
+     * @param   {import('@studiometa/js-toolkit/services/drag').DragServiceProps} props
+     * @returns {void}
+     */
+    dragged(props: import('@studiometa/js-toolkit/services/drag').DragServiceProps): void;
+}
+import { Base } from "@studiometa/js-toolkit";

package/molecules/Slider/SliderDrag.js

@@ -0,0 +1,19 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { Base, withDrag } from "@studiometa/js-toolkit";
+class SliderDrag extends withDrag(Base) {
+  dragged(props) {
+    this.$emit(props.mode, props);
+  }
+}
+__publicField(SliderDrag, "config", {
+  name: "SliderDrag",
+  emits: ["start", "drag", "drop", "inertia", "stop"]
+});
+export {
+  SliderDrag as default
+};

package/molecules/Slider/SliderItem.cjs

@@ -0,0 +1,130 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// packages/ui/molecules/Slider/SliderItem.js
+var SliderItem_exports = {};
+__export(SliderItem_exports, {
+  default: () => SliderItem
+});
+var import_js_toolkit = require("@studiometa/js-toolkit");
+var import_utils = require("@studiometa/js-toolkit/utils");
+var SliderItem = class extends (0, import_js_toolkit.withIntersectionObserver)(import_js_toolkit.Base, { threshold: [0, 1] }) {
+  constructor() {
+    super(...arguments);
+    __publicField(this, "isVisible", false);
+    __publicField(this, "x", 0);
+    __publicField(this, "dampedX", 0);
+  }
+  mounted() {
+    this.updateRectAdjustedWithX();
+  }
+  resized() {
+    this.updateRectAdjustedWithX();
+  }
+  destroyed() {
+    this.moveInstantly(0);
+  }
+  intersected([{ intersectionRatio, isIntersecting }]) {
+    if (intersectionRatio >= 1) {
+      this.$emit("is-fully-visible");
+      this.$el.setAttribute("aria-hidden", "false");
+    } else if (intersectionRatio > 0) {
+      this.$emit("is-partially-visible");
+      this.$el.setAttribute("aria-hidden", "true");
+    } else {
+      this.$emit("is-hidden");
+      this.$el.setAttribute("aria-hidden", "true");
+    }
+    this.isVisible = isIntersecting;
+  }
+  ticked() {
+    this.dampedX = (0, import_utils.damp)(this.x, this.dampedX, 0.2, 1e-5);
+    this.$el.style.transform = `${(0, import_utils.matrix)({
+      translateX: this.dampedX
+    })} translateZ(0px)`;
+    if (this.dampedX === this.x) {
+      this.$services.disable("ticked");
+    }
+  }
+  activate() {
+    this.$el.classList.add("is-active");
+  }
+  disactivate() {
+    this.$el.classList.remove("is-active");
+  }
+  move(targetPosition) {
+    this.x = targetPosition;
+    if (!this.$services.has("ticked")) {
+      this.$services.enable("ticked");
+    }
+  }
+  moveInstantly(targetPosition) {
+    this.x = targetPosition;
+    this.dampedX = targetPosition;
+    this.$el.style.transform = `${(0, import_utils.matrix)({
+      translateX: targetPosition
+    })} translateZ(0px)`;
+  }
+  willBeVisible(targetPosition) {
+    return this.rect.x + targetPosition < window.innerWidth * 1.5 && this.rect.x + targetPosition + this.rect.width > window.innerWidth * -0.5;
+  }
+  willBeFullyVisible(targetPosition) {
+    return this.rect.x + targetPosition < window.innerWidth && this.rect.x + targetPosition > 0 && this.rect.x + targetPosition + this.rect.width < window.innerWidth && this.rect.x + targetPosition + this.rect.width > 0;
+  }
+  updateRectAdjustedWithX() {
+    const x = this.x * -1;
+    const rect = this.$el.getBoundingClientRect().toJSON();
+    this.rect = __spreadProps(__spreadValues({}, rect), {
+      left: rect.left + x,
+      right: rect.left + x + rect.width,
+      x: rect.left + x
+    });
+  }
+};
+__publicField(SliderItem, "config", {
+  name: "SliderItem",
+  emits: ["is-fully-visible", "is-partially-visible", "is-hidden"]
+});
+module.exports = __toCommonJS(SliderItem_exports);
+if (module.exports.default) module.exports = module.exports.default;

package/molecules/Slider/SliderItem.d.ts

@@ -0,0 +1,106 @@
+/**
+ * Manage a slider item and its state transition.
+ */
+export default class SliderItem extends Base {
+    /**
+     * Config.
+     */
+    static config: {
+        name: string;
+        emits: string[];
+    };
+    /**
+     * Wether the SliderItem is visible or not.
+     * @type {Boolean}
+     */
+    isVisible: boolean;
+    /**
+     * The SliderItem `x` position.
+     * @type {number}
+     */
+    x: number;
+    /**
+     * The smoothed `x` position.
+     * @type {number}
+     */
+    dampedX: number;
+    /**
+     * Set SliderItem bounding rectangle on mount.
+     *
+     * @returns {void}
+     */
+    mounted(): void;
+    /**
+     * Update SliderItem bounding rectangle on resize.
+     *
+     * @returns {void}
+     */
+    resized(): void;
+    /**
+     * Reset position to `0` on destroy.
+     *
+     * @returns {void}
+     */
+    destroyed(): void;
+    /**
+     * Intersected hook.
+     *
+     * @param   {IntersectionObserverEntry[]} entries
+     * @returns {void}
+     */
+    intersected([{ intersectionRatio, isIntersecting }]: IntersectionObserverEntry[]): void;
+    /**
+     * Ticked hook.
+     *
+     * @returns {void}
+     */
+    ticked(): void;
+    /**
+     * Enable the SliderItem.
+     *
+     * @returns {void}
+     */
+    activate(): void;
+    /**
+     * Disable the SliderItem.
+     *
+     * @returns {void}
+     */
+    disactivate(): void;
+    /**
+     * Move the SliderItem to the given target position.
+     *
+     * @param   {number} targetPosition
+     * @returns {void}
+     */
+    move(targetPosition: number): void;
+    /**
+     * Move the SliderItem instantly to the given target position.
+     *
+     * @param   {number} targetPosition
+     * @returns {void}
+     */
+    moveInstantly(targetPosition: number): void;
+    /**
+     * Check if SliderItem is partially visible for the given target position.
+     *
+     * @param   {number} targetPosition
+     * @returns {boolean}
+     */
+    willBeVisible(targetPosition: number): boolean;
+    /**
+     * Check if SliderItem is fully visible for the given target position.
+     *
+     * @param   {number} targetPosition
+     * @returns {boolean}
+     */
+    willBeFullyVisible(targetPosition: number): boolean;
+    /**
+     * Update the bounding rectangle values without the current transformation.
+     *
+     * @returns {void}
+     */
+    updateRectAdjustedWithX(): void;
+    rect: any;
+}
+import { Base } from "@studiometa/js-toolkit";