kommandant 0.2.0 → 0.2.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8b3c12cb6c51778cd6575684e3c818960bc1db275aa4f2f5bc4bf1c39c0c57f6
-  data.tar.gz: 7cbc64969033ebf7170bce6e65fe414db2c2b9e4ccff31f645f6f385b20c27d5
+  metadata.gz: a2574c9d2b6dfd75efee2ed6f9af3f92cfbd0b89a5e207d546f1e5979f8226ad
+  data.tar.gz: a0451d7914c31befe537e5703a80d22018fb4f60c0abb0faafb7f6c12542dbbe
 SHA512:
-  metadata.gz: 4cf20342a6a8a5520652fa2949dea0aef98556c052db6c05ee59cb7203bd192dc7a60020af8e7193857efbbf3d545ad42f2dd1f8fe29d9cbf43b269f02bdf78b
-  data.tar.gz: 63115cdca2ea3fced0cb93466fd5a6941ed3bf3033fc82a0e03afa695b4be80c05b73ef13216d398a9e61bf606346dfbede225d233a3e30dd90f7213a5629ef9
+  metadata.gz: 0eb9c48d8e9c06c8d9d1e905a8b4be846aa347abfba90a24479ce07da98eff5f0fec693fee27a24346ccfdf2701e81268272d7decef58eda0c8e31b01c11457b
+  data.tar.gz: afc40b7911d8ee7c02669819b5d331f4500ceec455de4b5ba6a4cbcdf317222b27d5f652886fe976c2e599bacaa3f96ee1a082a70b5e66d6246f9f4f45814776

data/lib/kommandant/version.rb

@@ -1,3 +1,3 @@
 module Kommandant
-  VERSION = "0.2.0"
+  VERSION = "0.2.1"
 end

data/vendor/assets/javascripts/command_palette.js

@@ -0,0 +1,120 @@
+import { Controller } from "@hotwired/stimulus"
+import { enter, leave, toggle } from "./transition"
+
+export default class extends Controller {
+  static targets = ["background", "panel", "input", "content", "loadingMessage", "previousPageLink", "nextPageLink"]
+  static values = {
+    open: { type: Boolean, default: false },
+    loadingMessageDelay: { type: Number, default: 100 },
+    animationDuration: { type: Number, default: 200 },
+    modifierKeyDown: { type: Boolean, default: false }
+  }
+
+  initialize() {
+    this.submit = this.debounce(this.submit, 500).bind(this);
+  }
+
+  toggle(event) {
+    event.preventDefault()
+
+    toggle(this.backgroundTarget)
+    toggle(this.panelTarget)
+    this.openValue = !this.openValue
+  }
+
+  show(event) {
+    event.preventDefault()
+
+    enter(this.backgroundTarget)
+    enter(this.panelTarget)
+    this.openValue = true
+  }
+
+  hide(event) {
+    event.preventDefault()
+
+    leave(this.backgroundTarget)
+    leave(this.panelTarget)
+    this.openValue = false
+  }
+
+  hideWithBackgroundOverlay(event) {
+    if (event.target === this.panelTarget) {
+      this.hide(event)
+    }
+  }
+
+  submit(event) {
+    const ignoreKeys = ["Enter", "Tab", "Escape", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Home", "End", "Alt", "Control", "Meta", "Shift"]
+    const modifierKeyPressed = event.ctrlKey || event.metaKey
+
+    if (!modifierKeyPressed && !ignoreKeys.includes(event.key) && this.inputTarget.value !== "") {
+      this.inputTarget.form.requestSubmit()
+    }
+  }
+
+  reset() {
+    setTimeout(() => {
+      Turbo.visit("/kommandant/searches/new", { frame: "command_palette" })
+    }, this.animationDurationValue)
+  }
+
+  showLoadingMessage() {
+    this.loadingTimeout = setTimeout(() => {
+      this.contentTarget.classList.add("hidden")
+      this.loadingMessageTarget.classList.remove("hidden")
+    }, this.loadingMessageDelayValue)
+  }
+
+  nextPage(event) {
+    event.preventDefault()
+
+    if (this.hasNextPageLinkTarget) {
+      this.nextPageLinkTarget.click()
+    }
+  }
+
+  previousPage(event) {
+    event.preventDefault()
+
+    if (this.hasPreviousPageLinkTarget) {
+      this.previousPageLinkTarget.click()
+    }
+  }
+
+  // Private
+
+  openValueChanged(value, previousValue) {
+    this.focusInputTarget()
+
+    if (value === false && previousValue !== undefined) {
+      this.reset()
+    }
+  }
+
+  inputTargetConnected() {
+    this.focusInputTarget()
+    clearTimeout(this.loadingTimeout)
+  }
+
+  focusInputTarget() {
+    if (this.openValue) {
+      this.inputTarget.focus()
+
+      // Set cursor at end of inputted text
+      let temp = this.inputTarget.value
+      this.inputTarget.value = ""
+      this.inputTarget.value = temp
+    }
+  }
+
+  debounce(func, delay) {
+    let timeoutId;
+    return function (...args) {
+      clearTimeout(timeoutId);
+      timeoutId = setTimeout(() => {
+        func.apply(this, args);
+      }, delay);
+    };
+  }
+}

data/vendor/assets/javascripts/keyboard_navigation.js

@@ -0,0 +1,72 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static targets = ["focusable"]
+  static values = { activeOptionIndex: { type: Number, default: 0 } }
+
+  connect() {
+    if (this.activeOption) {
+      this.activateOption()
+    }
+  }
+
+  down(event) {
+    event.preventDefault()
+
+    if (this.activeOptionIndexValue < (this.focusableTargets.length - 1)) {
+      this.deactivateOption()
+      this.activeOptionIndexValue++
+      this.activateOption()
+    }
+  }
+
+  up(event) {
+    event.preventDefault()
+
+    if (this.activeOptionIndexValue > 0) {
+      this.deactivateOption()
+      this.activeOptionIndexValue--
+      this.activateOption()
+    }
+  }
+
+  focus(event) {
+    this.deactivateOption()
+    this.activeOptionIndexValue = this.focusableTargets.indexOf(event.currentTarget)
+    this.activateOption()
+  }
+
+  select(event) {
+    if (this.hasFocusableTarget && this.focusableTargetIsVisible) {
+      event.preventDefault()
+
+      this.activeOption.click()
+    }
+  }
+
+  // Private
+
+  deactivateOption() {
+    this.activeOption.dataset.active = false
+  }
+
+  activateOption() {
+    this.activeOption.dataset.active = true
+  }
+
+  focusableTargetDisconnected() {
+    this.activeOptionIndexValue = 0
+  }
+
+  focusableTargetConnected() {
+    this.activateOption()
+  }
+
+  get activeOption() {
+    return this.focusableTargets[this.activeOptionIndexValue]
+  }
+
+  get focusableTargetIsVisible() {
+    return this.focusableTarget.offsetParent !== null
+  }
+}

data/vendor/assets/javascripts/kommandant.js

@@ -0,0 +1,2 @@
+export { default as CommandPalette } from './command_palette'
+export { default as KeyboardNavigation } from './keyboard_navigation'

data/vendor/assets/javascripts/transition.js

@@ -0,0 +1,57 @@
+// This was taken from https://github.com/mmccall10/el-transition but is included here to avoid the need for a separate package
+
+export async function enter(element, transitionName = null) {
+  element.classList.remove('hidden')
+  await transition('enter', element, transitionName)
+}
+
+export async function leave(element, transitionName = null) {
+  await transition('leave', element, transitionName)
+  element.classList.add('hidden')
+}
+
+export async function toggle(element, transitionName = null) {
+  if (element.classList.contains('hidden')) {
+    await enter(element, transitionName)
+  } else {
+    await leave(element, transitionName)
+  }
+}
+
+async function transition(direction, element, animation) {
+  const dataset = element.dataset
+  const animationClass = animation ? `${animation}-${direction}` : direction
+  let transition = `transition${direction.charAt(0).toUpperCase() + direction.slice(1)}`
+  const genesis = dataset[transition] ? dataset[transition].split(" ") : [animationClass]
+  const start = dataset[`${transition}Start`] ? dataset[`${transition}Start`].split(" ") : [`${animationClass}-start`]
+  const end = dataset[`${transition}End`] ? dataset[`${transition}End`].split(" ") : [`${animationClass}-end`]
+
+  addClasses(element, genesis)
+  addClasses(element, start)
+  await nextFrame()
+  removeClasses(element, start)
+  addClasses(element, end);
+  await afterTransition(element)
+  removeClasses(element, end)
+  removeClasses(element, genesis)
+}
+
+function addClasses(element, classes) {
+  element.classList.add(...classes)
+}
+
+function removeClasses(element, classes) {
+  element.classList.remove(...classes)
+}
+
+function nextFrame() {
+  return new Promise(resolve => {
+    requestAnimationFrame(() => {
+      requestAnimationFrame(resolve)
+    });
+  });
+}
+
+function afterTransition(element) {
+  return Promise.all(element.getAnimations().map(animation => animation.finished));
+}

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: kommandant
 version: !ruby/object:Gem::Version
-  version: 0.2.0
+  version: 0.2.1
 platform: ruby
 authors:
 - Nicolai Bach Woller
@@ -133,6 +133,10 @@ files:
 - lib/kommandant/engine.rb
 - lib/kommandant/version.rb
 - lib/tasks/kommandant_tasks.rake
+- vendor/assets/javascripts/command_palette.js
+- vendor/assets/javascripts/keyboard_navigation.js
+- vendor/assets/javascripts/kommandant.js
+- vendor/assets/javascripts/transition.js
 homepage: https://traels.it
 licenses:
 - MIT