solid-slider 1.3.1 → 1.3.2

package/README.md

@@ -163,6 +163,7 @@ Thie library exports it's own CSS which is the basic Keen-Slider implementation
 - 1.2.7 - Maybe I should actually export the .css? That'd be a good idea, right? /s
 - 1.2.9 - Updated timer primitive and patched issue with current slide setting from initial options.
 - 1.3.1 - Introduced Slider, SliderProvider and SliderButton for ease.
+- 1.3.2 - Patched issue with initial slide not setting current signal.
 
 ## Keen Options API
 

package/dist/index/index.common.js

@@ -32,8 +32,13 @@ var KeenSlider__default = /*#__PURE__*/_interopDefaultLegacy(KeenSlider);
  * ```
  */
 const createSlider = (options, ...plugins) => {
+  var _opts;
+
   let slider;
-  const [current, setCurrent] = solidJs.createSignal(0);
+
+  const opts = () => typeof options == "function" ? options() : options;
+
+  const [current, setCurrent] = solidJs.createSignal(((_opts = opts()) === null || _opts === void 0 ? void 0 : _opts.initial) || 0);
 
   const destroy = () => slider && slider.destroy(); // Slider creation method and directive function
 
@@ -41,20 +46,19 @@ const createSlider = (options, ...plugins) => {
   const create = el => {
     el.classList.add("keen-slider"); // @ts-ignore
 
-    const opts = () => ({
+    const getOptions = () => ({
       selector: el.childNodes,
-      ...(typeof options == "function" ? options() : options)
+      ...opts()
     });
 
     solidJs.onMount(() => {
-      slider = new KeenSlider__default["default"](el, opts(), plugins);
+      slider = new KeenSlider__default["default"](el, getOptions(), plugins);
       slider.on("slideChanged", () => setCurrent(slider.track.details.rel));
-      setCurrent(slider.track.details.rel);
     });
     solidJs.onCleanup(destroy);
 
     if (typeof options === "function") {
-      solidJs.createEffect(solidJs.on(() => options, () => slider && slider.update(opts())));
+      solidJs.createEffect(solidJs.on(() => options, () => slider && slider.update(getOptions())));
     }
   };
 

package/dist/index/index.common.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.common.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n  KeenSliderHooks,\n  KeenSliderInstance,\n  KeenSliderOptions,\n  KeenSliderPlugin,\n  TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n  namespace JSX {\n    interface Directives {\n      slider: {};\n    }\n  }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n  options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n  ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n  create: (el: HTMLElement) => void,\n  helpers: {\n    current: Accessor<number>;\n    next: Accessor<void>;\n    prev: Accessor<void>;\n    moveTo: (\n      id: number,\n      duration?: number,\n      absolute?: boolean,\n      easing?: (t: number) => number\n    ) => void;\n    details: Accessor<TrackDetails>;\n    slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n    destroy: Accessor<void>;\n  }\n] => {\n  let slider: KeenSliderInstance<O, P, H> | undefined;\n  const [current, setCurrent] = createSignal(0);\n  const destroy = () => slider && slider.destroy();\n  // Slider creation method and directive function\n  const create = (el: HTMLElement) => {\n    el.classList.add(\"keen-slider\");\n    // @ts-ignore\n    const opts: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n      selector: el.childNodes,\n      ...(typeof options == \"function\" ? options() : options)\n    });\n    onMount(() => {\n      slider = new KeenSlider<O, P, H>(el, opts(), plugins);\n      slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n      setCurrent(slider!.track.details.rel);\n    });\n    onCleanup(destroy);\n    if (typeof options === \"function\") {\n      createEffect(\n        on(\n          () => options,\n          () => slider && slider.update(opts())\n        )\n      );\n    }\n  };\n  return [\n    create,\n    {\n      current,\n      next: () => slider && slider.next(),\n      prev: () => slider && slider.prev(),\n      details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n      slider: () => slider,\n      moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n        slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n      destroy\n    }\n  ];\n};\n","import { Component, createContext, useContext, createSignal, createMemo } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n  ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n  return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: Component = props => (\n  <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: Component<{\n  options?: KeenSliderOptions;\n  plugins?: KeenSliderPlugin[];\n}> = props => {\n  if (isServer) return props.children;\n  const [, setHelpers] = useContext(SliderContext);\n  const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n  setHelpers(helpers);\n  slider;\n  return <div use:slider>{props.children}</div>;\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: Component<{\n  next?: boolean;\n  prev?: boolean;\n  disabled?: boolean;\n  class?: string;\n  classList?: { [k: string]: boolean | undefined };\n}> = props => {\n  const context = useContext(SliderContext);\n  const changeSlide = () => {\n    if (context == null) return;\n    const [helpers] = context;\n    props.next ? helpers()?.next() : helpers()?.prev();\n  };\n  return (\n    <button\n      disabled={props.disabled || false}\n      class={props.class}\n      classList={props.classList}\n      onClick={changeSlide}\n    >\n      {props.children}\n    </button>\n  );\n};\n"],"names":["createSlider","options","plugins","slider","current","setCurrent","createSignal","destroy","create","el","classList","add","opts","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}
+{"version":3,"file":"index.common.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n  KeenSliderHooks,\n  KeenSliderInstance,\n  KeenSliderOptions,\n  KeenSliderPlugin,\n  TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n  namespace JSX {\n    interface Directives {\n      slider: {};\n    }\n  }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n  options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n  ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n  create: (el: HTMLElement) => void,\n  helpers: {\n    current: Accessor<number>;\n    next: Accessor<void>;\n    prev: Accessor<void>;\n    moveTo: (\n      id: number,\n      duration?: number,\n      absolute?: boolean,\n      easing?: (t: number) => number\n    ) => void;\n    details: Accessor<TrackDetails>;\n    slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n    destroy: Accessor<void>;\n  }\n] => {\n  let slider: KeenSliderInstance<O, P, H> | undefined;\n  const opts = () => typeof options == \"function\" ? options() : options;\n  const [current, setCurrent] = createSignal(opts()?.initial || 0);\n  const destroy = () => slider && slider.destroy();\n  // Slider creation method and directive function\n  const create = (el: HTMLElement) => {\n    el.classList.add(\"keen-slider\");\n    // @ts-ignore\n    const getOptions: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n      selector: el.childNodes,\n      ...(opts())\n    });\n    onMount(() => {\n      slider = new KeenSlider<O, P, H>(el, getOptions(), plugins);\n      slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n    });\n    onCleanup(destroy);\n    if (typeof options === \"function\") {\n      createEffect(\n        on(\n          () => options,\n          () => slider && slider.update(getOptions())\n        )\n      );\n    }\n  };\n  return [\n    create,\n    {\n      current,\n      next: () => slider && slider.next(),\n      prev: () => slider && slider.prev(),\n      details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n      slider: () => slider,\n      moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n        slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n      destroy\n    }\n  ];\n};\n","import { Component, createContext, useContext, createSignal, createMemo } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n  ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n  return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: Component = props => (\n  <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: Component<{\n  options?: KeenSliderOptions;\n  plugins?: KeenSliderPlugin[];\n}> = props => {\n  if (isServer) return props.children;\n  const [, setHelpers] = useContext(SliderContext);\n  const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n  setHelpers(helpers);\n  slider;\n  return <div use:slider>{props.children}</div>;\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: Component<{\n  next?: boolean;\n  prev?: boolean;\n  disabled?: boolean;\n  class?: string;\n  classList?: { [k: string]: boolean | undefined };\n}> = props => {\n  const context = useContext(SliderContext);\n  const changeSlide = () => {\n    if (context == null) return;\n    const [helpers] = context;\n    props.next ? helpers()?.next() : helpers()?.prev();\n  };\n  return (\n    <button\n      disabled={props.disabled || false}\n      class={props.class}\n      classList={props.classList}\n      onClick={changeSlide}\n    >\n      {props.children}\n    </button>\n  );\n};\n"],"names":["createSlider","options","plugins","slider","opts","current","setCurrent","createSignal","initial","destroy","create","el","classList","add","getOptions","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}

package/dist/index/index.module.js

@@ -24,8 +24,13 @@ import { createComponent, isServer, insert, effect, classList, delegateEvents, t
  * ```
  */
 const createSlider = (options, ...plugins) => {
+  var _opts;
+
   let slider;
-  const [current, setCurrent] = createSignal(0);
+
+  const opts = () => typeof options == "function" ? options() : options;
+
+  const [current, setCurrent] = createSignal(((_opts = opts()) === null || _opts === void 0 ? void 0 : _opts.initial) || 0);
 
   const destroy = () => slider && slider.destroy(); // Slider creation method and directive function
 
@@ -33,20 +38,19 @@ const createSlider = (options, ...plugins) => {
   const create = el => {
     el.classList.add("keen-slider"); // @ts-ignore
 
-    const opts = () => ({
+    const getOptions = () => ({
       selector: el.childNodes,
-      ...(typeof options == "function" ? options() : options)
+      ...opts()
     });
 
     onMount(() => {
-      slider = new KeenSlider(el, opts(), plugins);
+      slider = new KeenSlider(el, getOptions(), plugins);
       slider.on("slideChanged", () => setCurrent(slider.track.details.rel));
-      setCurrent(slider.track.details.rel);
     });
     onCleanup(destroy);
 
     if (typeof options === "function") {
-      createEffect(on(() => options, () => slider && slider.update(opts())));
+      createEffect(on(() => options, () => slider && slider.update(getOptions())));
     }
   };
 

package/dist/index/index.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n  KeenSliderHooks,\n  KeenSliderInstance,\n  KeenSliderOptions,\n  KeenSliderPlugin,\n  TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n  namespace JSX {\n    interface Directives {\n      slider: {};\n    }\n  }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n  options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n  ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n  create: (el: HTMLElement) => void,\n  helpers: {\n    current: Accessor<number>;\n    next: Accessor<void>;\n    prev: Accessor<void>;\n    moveTo: (\n      id: number,\n      duration?: number,\n      absolute?: boolean,\n      easing?: (t: number) => number\n    ) => void;\n    details: Accessor<TrackDetails>;\n    slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n    destroy: Accessor<void>;\n  }\n] => {\n  let slider: KeenSliderInstance<O, P, H> | undefined;\n  const [current, setCurrent] = createSignal(0);\n  const destroy = () => slider && slider.destroy();\n  // Slider creation method and directive function\n  const create = (el: HTMLElement) => {\n    el.classList.add(\"keen-slider\");\n    // @ts-ignore\n    const opts: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n      selector: el.childNodes,\n      ...(typeof options == \"function\" ? options() : options)\n    });\n    onMount(() => {\n      slider = new KeenSlider<O, P, H>(el, opts(), plugins);\n      slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n      setCurrent(slider!.track.details.rel);\n    });\n    onCleanup(destroy);\n    if (typeof options === \"function\") {\n      createEffect(\n        on(\n          () => options,\n          () => slider && slider.update(opts())\n        )\n      );\n    }\n  };\n  return [\n    create,\n    {\n      current,\n      next: () => slider && slider.next(),\n      prev: () => slider && slider.prev(),\n      details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n      slider: () => slider,\n      moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n        slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n      destroy\n    }\n  ];\n};\n","import { Component, createContext, useContext, createSignal, createMemo } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n  ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n  return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: Component = props => (\n  <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: Component<{\n  options?: KeenSliderOptions;\n  plugins?: KeenSliderPlugin[];\n}> = props => {\n  if (isServer) return props.children;\n  const [, setHelpers] = useContext(SliderContext);\n  const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n  setHelpers(helpers);\n  slider;\n  return <div use:slider>{props.children}</div>;\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: Component<{\n  next?: boolean;\n  prev?: boolean;\n  disabled?: boolean;\n  class?: string;\n  classList?: { [k: string]: boolean | undefined };\n}> = props => {\n  const context = useContext(SliderContext);\n  const changeSlide = () => {\n    if (context == null) return;\n    const [helpers] = context;\n    props.next ? helpers()?.next() : helpers()?.prev();\n  };\n  return (\n    <button\n      disabled={props.disabled || false}\n      class={props.class}\n      classList={props.classList}\n      onClick={changeSlide}\n    >\n      {props.children}\n    </button>\n  );\n};\n"],"names":["createSlider","options","plugins","slider","current","setCurrent","createSignal","destroy","create","el","classList","add","opts","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}
+{"version":3,"file":"index.module.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n  KeenSliderHooks,\n  KeenSliderInstance,\n  KeenSliderOptions,\n  KeenSliderPlugin,\n  TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n  namespace JSX {\n    interface Directives {\n      slider: {};\n    }\n  }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n  options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n  ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n  create: (el: HTMLElement) => void,\n  helpers: {\n    current: Accessor<number>;\n    next: Accessor<void>;\n    prev: Accessor<void>;\n    moveTo: (\n      id: number,\n      duration?: number,\n      absolute?: boolean,\n      easing?: (t: number) => number\n    ) => void;\n    details: Accessor<TrackDetails>;\n    slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n    destroy: Accessor<void>;\n  }\n] => {\n  let slider: KeenSliderInstance<O, P, H> | undefined;\n  const opts = () => typeof options == \"function\" ? options() : options;\n  const [current, setCurrent] = createSignal(opts()?.initial || 0);\n  const destroy = () => slider && slider.destroy();\n  // Slider creation method and directive function\n  const create = (el: HTMLElement) => {\n    el.classList.add(\"keen-slider\");\n    // @ts-ignore\n    const getOptions: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n      selector: el.childNodes,\n      ...(opts())\n    });\n    onMount(() => {\n      slider = new KeenSlider<O, P, H>(el, getOptions(), plugins);\n      slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n    });\n    onCleanup(destroy);\n    if (typeof options === \"function\") {\n      createEffect(\n        on(\n          () => options,\n          () => slider && slider.update(getOptions())\n        )\n      );\n    }\n  };\n  return [\n    create,\n    {\n      current,\n      next: () => slider && slider.next(),\n      prev: () => slider && slider.prev(),\n      details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n      slider: () => slider,\n      moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n        slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n      destroy\n    }\n  ];\n};\n","import { Component, createContext, useContext, createSignal, createMemo } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n  ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n  return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: Component = props => (\n  <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: Component<{\n  options?: KeenSliderOptions;\n  plugins?: KeenSliderPlugin[];\n}> = props => {\n  if (isServer) return props.children;\n  const [, setHelpers] = useContext(SliderContext);\n  const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n  setHelpers(helpers);\n  slider;\n  return <div use:slider>{props.children}</div>;\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: Component<{\n  next?: boolean;\n  prev?: boolean;\n  disabled?: boolean;\n  class?: string;\n  classList?: { [k: string]: boolean | undefined };\n}> = props => {\n  const context = useContext(SliderContext);\n  const changeSlide = () => {\n    if (context == null) return;\n    const [helpers] = context;\n    props.next ? helpers()?.next() : helpers()?.prev();\n  };\n  return (\n    <button\n      disabled={props.disabled || false}\n      class={props.class}\n      classList={props.classList}\n      onClick={changeSlide}\n    >\n      {props.children}\n    </button>\n  );\n};\n"],"names":["createSlider","options","plugins","slider","opts","current","setCurrent","createSignal","initial","destroy","create","el","classList","add","getOptions","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}

package/dist/index/primitive.js

@@ -23,24 +23,24 @@ import KeenSlider from "keen-slider";
  */
 export const createSlider = (options, ...plugins) => {
     let slider;
-    const [current, setCurrent] = createSignal(0);
+    const opts = () => typeof options == "function" ? options() : options;
+    const [current, setCurrent] = createSignal(opts()?.initial || 0);
     const destroy = () => slider && slider.destroy();
     // Slider creation method and directive function
     const create = (el) => {
         el.classList.add("keen-slider");
         // @ts-ignore
-        const opts = () => ({
+        const getOptions = () => ({
             selector: el.childNodes,
-            ...(typeof options == "function" ? options() : options)
+            ...(opts())
         });
         onMount(() => {
-            slider = new KeenSlider(el, opts(), plugins);
+            slider = new KeenSlider(el, getOptions(), plugins);
             slider.on("slideChanged", () => setCurrent(slider.track.details.rel));
-            setCurrent(slider.track.details.rel);
         });
         onCleanup(destroy);
         if (typeof options === "function") {
-            createEffect(on(() => options, () => slider && slider.update(opts())));
+            createEffect(on(() => options, () => slider && slider.update(getOptions())));
         }
     };
     return [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "solid-slider",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "A slider utility for SolidJS.",
   "author": "David Di Biase",
   "repository": {