@rokkit/actions 1.0.0-next.119 → 1.0.0-next.121

package/dist/sites/learn/src/lib/theme.svelte.d.ts

@@ -0,0 +1,70 @@
+/**
+ * @typedef {string} Theme
+ */
+/**
+ * @typedef {Object} Shades
+ * @property {string} 50
+ * @property {string} 100
+ * @property {string} 200
+ * @property {string} 300
+ * @property {string} 400
+ * @property {string} 500
+ * @property {string} 600
+ * @property {string} 700
+ * @property {string} 800
+ * @property {string} 900
+ * @property {string} 950
+ */
+/**
+ * @typedef {Object} Palette
+ * @property {string} primary
+ * @property {string} onPrimary
+ * @property {string} secondary
+ * @property {string} onSecondary
+ * @property {string} accent
+ * @property {string} onAccent
+ * @property {string} neutral
+ * @property {string} onNeutral
+ * @property {string} error
+ * @property {string} onError
+ * @property {string} warning
+ * @property {string} onWarning
+ * @property {string} info
+ * @property {string} onInfo
+ * @property {string} success
+ * @property {string} onSuccess
+ */
+export class ThemeManager {
+    /** @type {string} */
+    name: string;
+    /** @type {ThemeMode} */
+    mode: ThemeMode;
+    #private;
+}
+export const theme: ThemeManager;
+export type ThemeMode = "dark" | "light";
+export type Theme = string;
+export type Shades = {
+    /**
+     * 50
+     */
+    "": string;
+};
+export type Palette = {
+    primary: string;
+    onPrimary: string;
+    secondary: string;
+    onSecondary: string;
+    accent: string;
+    onAccent: string;
+    neutral: string;
+    onNeutral: string;
+    error: string;
+    onError: string;
+    warning: string;
+    onWarning: string;
+    info: string;
+    onInfo: string;
+    success: string;
+    onSuccess: string;
+};

package/dist/sites/learn/src/routes/(learn)/+layout.d.ts

@@ -0,0 +1,12 @@
+/** @type {import('./$types').LayoutLoad} */
+export function load({ params }: {
+    params: any;
+}): Promise<{
+    menu: any;
+    fields: {
+        text: string;
+        isOpen: string;
+        key: string;
+    };
+    params: any;
+}>;

package/dist/sites/learn/src/routes/(learn)/[segment]/[...slug]/+page.d.ts

@@ -0,0 +1,8 @@
+/** @type {import('./$types').PageLoad} */
+export function load({ params }: {
+    params: any;
+}): Promise<{
+    params: any;
+    tutorial: any;
+}>;
+export const prerender: "auto";

package/dist/sites/learn/src/routes/+layout.d.ts

@@ -0,0 +1,18 @@
+/** @type {import('./$types').LayoutLoad} */
+export function load(): {
+    sections: never[];
+    app: {
+        name: string;
+        version: any;
+        about: string;
+    };
+    config: {
+        code: {
+            options: {
+                icon: string;
+                value: string;
+                label: string;
+            }[];
+        };
+    };
+};

package/dist/sites/quick-start/src/hooks.d.ts

@@ -0,0 +1 @@
+export const reroute: any;

package/dist/sites/quick-start/src/hooks.server.d.ts

@@ -0,0 +1,2 @@
+/** @type {import('@sveltejs/kit').Handle} */
+export const handle: import("@sveltejs/kit").Handle;

package/dist/sites/quick-start/src/lib/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/sites/quick-start/src/lib/paraglide/messages/en.d.ts

@@ -0,0 +1,3 @@
+export function hello_world(params: {
+    name: NonNullable<unknown>;
+}): string;

package/dist/sites/quick-start/src/lib/paraglide/messages/fr.d.ts

@@ -0,0 +1,3 @@
+export function hello_world(params: {
+    name: NonNullable<unknown>;
+}): string;

package/dist/sites/quick-start/src/lib/paraglide/messages/hi.d.ts

@@ -0,0 +1,3 @@
+export function hello_world(params: {
+    name: NonNullable<unknown>;
+}): string;

package/dist/sites/quick-start/src/lib/paraglide/messages.d.ts

@@ -0,0 +1,5 @@
+export function hello_world(params: {
+    name: NonNullable<unknown>;
+}, options?: {
+    languageTag?: "en" | "hi" | "fr";
+}): string;

package/dist/sites/quick-start/src/lib/paraglide/runtime.d.ts

@@ -0,0 +1,52 @@
+/**
+ * Check if something is an available language tag.
+ *
+ * @example
+ * 	if (isAvailableLanguageTag(params.locale)) {
+ * 		setLanguageTag(params.locale)
+ * 	} else {
+ * 		setLanguageTag("en")
+ * 	}
+ *
+ * @param {any} thing
+ * @returns {thing is AvailableLanguageTag}
+ */
+export function isAvailableLanguageTag(thing: any): thing is AvailableLanguageTag;
+/**
+ * The project's source language tag.
+ *
+ * @example
+ *   if (newlySelectedLanguageTag === sourceLanguageTag){
+ *     // do nothing as the source language tag is the default language
+ *     return
+ *   }
+ */
+export const sourceLanguageTag: "en";
+/**
+ * The project's available language tags.
+ *
+ * @example
+ *   if (availableLanguageTags.includes(userSelectedLanguageTag) === false){
+ *     throw new Error("Language tag not available")
+ *   }
+ */
+export const availableLanguageTags: readonly ["en", "hi", "fr"];
+/**
+ * Get the current language tag.
+ *
+ * @example
+ *   if (languageTag() === "de"){
+ *     console.log("Germany 🇩🇪")
+ *   } else if (languageTag() === "nl"){
+ *     console.log("Netherlands 🇳🇱")
+ *   }
+ *
+ * @type {() => AvailableLanguageTag}
+ */
+export let languageTag: () => AvailableLanguageTag;
+export function setLanguageTag(tag: AvailableLanguageTag | (() => AvailableLanguageTag)): void;
+export function onSetLanguageTag(fn: (languageTag: AvailableLanguageTag) => void): void;
+/**
+ * A language tag that is available in the project.
+ */
+export type AvailableLanguageTag = (typeof availableLanguageTags)[number];

package/dist/sites/quick-start/src/routes/+layout.d.ts

@@ -0,0 +1,9 @@
+/** @type {import('./$types').LayoutLoad} */
+export function load(): {
+    sections: never[];
+    app: {
+        name: string;
+        version: any;
+        about: string;
+    };
+};

package/dist/skinnable.svelte.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Applies theme variables to an element
+ * @param {HTMLElement} node - Element to apply variables to
+ * @param {Object.<string, string>} variables - CSS variables and their values
+ */
+export function skinnable(node: HTMLElement, variables: {
+    [x: string]: string;
+}): void;

package/dist/swipeable.svelte.d.ts

@@ -0,0 +1,14 @@
+/**
+ * A svelte action function that captures swipe actions and emits event for corresponding movements.
+ *
+ * @param {HTMLElement} node
+ * @param {import(./types).SwipeableOptions} options
+ * @returns {import('./types').SvelteActionReturn}
+ */
+export function swipeable(node: HTMLElement, options?: {
+    horizontal: boolean;
+    vertical: boolean;
+    threshold: number;
+    enabled: boolean;
+    minSpeed: number;
+}): import("./types").SvelteActionReturn;

package/dist/themable.svelte.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Update the theme attributes when the state changes.
+ *
+ * @param {HTMLElement} root
+ * @param {import('./types.js').ThemableConfig} options - Custom key mappings
+ */
+export function themable(root: HTMLElement, options: import("./types.js").ThemableConfig): void;

package/dist/types.d.ts

@@ -0,0 +1,72 @@
+export type EventMapping = {
+    /**
+     * - The event name
+     */
+    event: string;
+    /**
+     * - The keys that trigger the event
+     */
+    keys?: string[] | undefined;
+    /**
+     * - The pattern that triggers the event
+     */
+    pattern?: RegExp | undefined;
+};
+export type KeyboardConfig = {
+    [x: string]: RegExp | string[];
+};
+export type Direction = "vertical" | "horizontal";
+export type NavigatorOptions = {
+    /**
+     * - Whether the navigator is enabled
+     */
+    enabled: boolean;
+    /**
+     * - Whether the navigator is vertical or horizontal
+     */
+    direction: Direction;
+    /**
+     * - Whether the navigator supports multiple selections
+     */
+    multiselect: boolean;
+};
+export type DataWrapper = {
+    moveNext: Function;
+    movePrev: Function;
+    moveFirst: Function;
+    moveLast: Function;
+    expand: Function;
+    collapse: Function;
+    select: Function;
+    toggleExpansion: Function;
+};
+export type NavigatorActions = {
+    next: Function;
+    prev: Function;
+    first: Function;
+    last: Function;
+    expand: Function;
+    collapse: Function;
+    select: Function;
+};
+export type NavigatorConfig = {
+    /**
+     * - Whether the navigator is enabled
+     */
+    wrapper: Navigator;
+    /**
+     * - Whether the navigator is vertical or horizontal
+     */
+    options: NavigatorOptions;
+};
+export type Controller = {
+    moveNext: Function;
+    movePrev: Function;
+    moveFirst: Function;
+    moveLast: Function;
+    expand?: Function | undefined;
+    collapse?: Function | undefined;
+    select: Function;
+    extendSelection: Function;
+    toggleExpansion?: Function | undefined;
+};

package/dist/utils.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Finds the closest ancestor of the given element that has the given attribute.
+ *
+ * @param {HTMLElement} element
+ * @param {string} attribute
+ * @returns {HTMLElement|null}
+ */
+export function getClosestAncestorWithAttribute(element: HTMLElement, attribute: string): HTMLElement | null;
+export function handleAction(actions: any, event: any): void;
+/**
+ * Finds and returns an index path based on data-path attribute
+ *
+ * @param {MouseEvent} event
+ * @returns {number[]|null} null or index path array
+ */
+export function getPathFromEvent(event: MouseEvent): number[] | null;
+export function getEventForKey(keyMapping: import("./types.js").KeyboardConfig, key: string): string | null;
+export function getClickAction(event: MouseEvent): string;

package/package.json

@@ -1,12 +1,9 @@
 {
   "name": "@rokkit/actions",
-  "version": "1.0.0-next.119",
+  "version": "1.0.0-next.121",
   "description": "Contains generic actions that can be used in various components.",
   "author": "Jerry Thomas <me@jerrythomas.name>",
   "license": "MIT",
-  "main": "index.js",
-  "module": "src/index.js",
-  "types": "dist/index.d.ts",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -18,7 +15,9 @@
   },
   "files": [
     "src/**/*.js",
-    "src/**/*.svelte"
+    "dist/**/*.d.ts",
+    "README.md",
+    "package.json"
   ],
   "exports": {
     "./src": "./src",

package/src/kbd.js

@@ -5,9 +5,9 @@
  * @returns {Object} Object mapping arrow keys to movement handlers
  */
 function getHorizontalMovementActions(handlers, dir = 'ltr') {
-  return dir === 'rtl'
-    ? { ArrowRight: handlers.previous, ArrowLeft: handlers.next }
-    : { ArrowLeft: handlers.previous, ArrowRight: handlers.next }
+	return dir === 'rtl'
+		? { ArrowRight: handlers.previous, ArrowLeft: handlers.next }
+		: { ArrowLeft: handlers.previous, ArrowRight: handlers.next }
 }
 
 /**
@@ -16,7 +16,7 @@ function getHorizontalMovementActions(handlers, dir = 'ltr') {
  * @returns {Object} Object mapping arrow keys to movement handlers
  */
 function getVerticalMovementActions(handlers) {
-  return { ArrowUp: handlers.previous, ArrowDown: handlers.next }
+	return { ArrowUp: handlers.previous, ArrowDown: handlers.next }
 }
 
 /**
@@ -25,7 +25,7 @@ function getVerticalMovementActions(handlers) {
  * @returns {Object} Object mapping arrow keys to expand/collapse handlers
  */
 function getHorizontalExpandActions(handlers) {
-  return { ArrowUp: handlers.collapse, ArrowDown: handlers.expand }
+	return { ArrowUp: handlers.collapse, ArrowDown: handlers.expand }
 }
 
 /**
@@ -35,9 +35,9 @@ function getHorizontalExpandActions(handlers) {
  * @returns {Object} Object mapping arrow keys to expand/collapse handlers
  */
 function getVerticalExpandActions(handlers, dir = 'ltr') {
-  return dir === 'rtl'
-    ? { ArrowRight: handlers.collapse, ArrowLeft: handlers.expand }
-    : { ArrowLeft: handlers.collapse, ArrowRight: handlers.expand }
+	return dir === 'rtl'
+		? { ArrowRight: handlers.collapse, ArrowLeft: handlers.expand }
+		: { ArrowLeft: handlers.collapse, ArrowRight: handlers.expand }
 }
 
 /**
@@ -46,18 +46,18 @@ function getVerticalExpandActions(handlers, dir = 'ltr') {
  * @returns {Object} Object mapping keys to selection handlers
  */
 function getCommonActions(handlers) {
-  return {
-    Enter: handlers.select,
-    ' ': handlers.select
-  }
+	return {
+		Enter: handlers.select,
+		' ': handlers.select
+	}
 }
 
 // Default navigation options
 export const defaultNavigationOptions = {
-  orientation: 'vertical',
-  dir: 'ltr',
-  nested: false,
-  enabled: true
+	orientation: 'vertical',
+	dir: 'ltr',
+	nested: false,
+	enabled: true
 }
 
 /**
@@ -67,29 +67,29 @@ export const defaultNavigationOptions = {
  * @returns {Object} Object mapping key presses to handler functions
  */
 export function getKeyboardActions(options, handlers) {
-  const { orientation, dir, nested, enabled } = { ...defaultNavigationOptions, ...options }
-  
-  if (!enabled) return {}
-
-  const common = getCommonActions(handlers)
-  
-  // Determine movement actions based on orientation
-  const isHorizontal = orientation === 'horizontal'
-  const movement = isHorizontal 
-    ? getHorizontalMovementActions(handlers, dir)
-    : getVerticalMovementActions(handlers)
-  
-  // If not nested, we don't need expand/collapse actions
-  if (!nested) {
-    return { ...common, ...movement }
-  }
-  
-  // Determine expand/collapse actions based on orientation
-  const expandCollapse = isHorizontal 
-    ? getHorizontalExpandActions(handlers)
-    : getVerticalExpandActions(handlers, dir)
-  
-  return { ...common, ...movement, ...expandCollapse }
+	const { orientation, dir, nested, enabled } = { ...defaultNavigationOptions, ...options }
+
+	if (!enabled) return {}
+
+	const common = getCommonActions(handlers)
+
+	// Determine movement actions based on orientation
+	const isHorizontal = orientation === 'horizontal'
+	const movement = isHorizontal
+		? getHorizontalMovementActions(handlers, dir)
+		: getVerticalMovementActions(handlers)
+
+	// If not nested, we don't need expand/collapse actions
+	if (!nested) {
+		return { ...common, ...movement }
+	}
+
+	// Determine expand/collapse actions based on orientation
+	const expandCollapse = isHorizontal
+		? getHorizontalExpandActions(handlers)
+		: getVerticalExpandActions(handlers, dir)
+
+	return { ...common, ...movement, ...expandCollapse }
 }
 
 /**
@@ -97,50 +97,52 @@ export function getKeyboardActions(options, handlers) {
  *
  * @param {Object} options - Navigation options
  * @param {string} options.orientation - Whether navigation is horizontal or vertical
- * @param {string} options.dir - Text direction ('ltr' or 'rtl') 
+ * @param {string} options.dir - Text direction ('ltr' or 'rtl')
  * @param {boolean} options.nested - Whether navigation is nested
  * @returns {Object} Mapping of keys to actions
  */
 export function createKeyboardActionMap(options) {
-  const { orientation, dir, nested } = options
-  const isHorizontal = orientation === 'horizontal'
-
-  // Define movement actions based on orientation and direction
-  let movementActions = {}
-  if (isHorizontal) {
-    movementActions = dir === 'rtl' 
-      ? { ArrowRight: 'previous', ArrowLeft: 'next' }
-      : { ArrowLeft: 'previous', ArrowRight: 'next' }
-  } else {
-    movementActions = { ArrowUp: 'previous', ArrowDown: 'next' }
-  }
-
-  // Define expand/collapse actions for nested option
-  let nestedActions = {}
-  if (nested) {
-    if (isHorizontal) {
-      nestedActions = { ArrowUp: 'collapse', ArrowDown: 'expand' }
-    } else {
-      nestedActions = dir === 'rtl'
-        ? { ArrowRight: 'collapse', ArrowLeft: 'expand' }
-        : { ArrowLeft: 'collapse', ArrowRight: 'expand' }
-    }
-  }
-
-  // Common actions regardless of options
-  const commonActions = {
-    Enter: 'select',
-    ' ': 'select',
-    Home: 'first',
-    End: 'last'
-  }
-
-  // Combine all possible actions
-  return {
-    ...commonActions,
-    ...movementActions,
-    ...nestedActions
-  }
+	const { orientation, dir, nested } = options
+	const isHorizontal = orientation === 'horizontal'
+
+	// Define movement actions based on orientation and direction
+	let movementActions = {}
+	if (isHorizontal) {
+		movementActions =
+			dir === 'rtl'
+				? { ArrowRight: 'previous', ArrowLeft: 'next' }
+				: { ArrowLeft: 'previous', ArrowRight: 'next' }
+	} else {
+		movementActions = { ArrowUp: 'previous', ArrowDown: 'next' }
+	}
+
+	// Define expand/collapse actions for nested option
+	let nestedActions = {}
+	if (nested) {
+		if (isHorizontal) {
+			nestedActions = { ArrowUp: 'collapse', ArrowDown: 'expand' }
+		} else {
+			nestedActions =
+				dir === 'rtl'
+					? { ArrowRight: 'collapse', ArrowLeft: 'expand' }
+					: { ArrowLeft: 'collapse', ArrowRight: 'expand' }
+		}
+	}
+
+	// Common actions regardless of options
+	const commonActions = {
+		Enter: 'select',
+		' ': 'select',
+		Home: 'first',
+		End: 'last'
+	}
+
+	// Combine all possible actions
+	return {
+		...commonActions,
+		...movementActions,
+		...nestedActions
+	}
 }
 
 /**
@@ -151,12 +153,12 @@ export function createKeyboardActionMap(options) {
  * @returns {Object} Mapping of keys to actions
  */
 export function createModifierKeyboardActionMap(options) {
-  const isHorizontal = options.orientation === 'horizontal'
-  const common = { ' ': 'extend', Home: 'first', End: 'last' }
-  const directional = isHorizontal
-    ? { ArrowLeft: 'first', ArrowRight: 'last' }
-    : { ArrowUp: 'first', ArrowDown: 'last' }
-  return { ...common, ...directional }
+	const isHorizontal = options.orientation === 'horizontal'
+	const common = { ' ': 'extend', Home: 'first', End: 'last' }
+	const directional = isHorizontal
+		? { ArrowLeft: 'first', ArrowRight: 'last' }
+		: { ArrowUp: 'first', ArrowDown: 'last' }
+	return { ...common, ...directional }
 }
 
 /**
@@ -166,20 +168,20 @@ export function createModifierKeyboardActionMap(options) {
  * @returns {string|null} The action to perform, or null if no action is defined
  */
 export function getKeyboardAction(event, options = {}) {
-  const { key, ctrlKey, metaKey } = event
+	const { key, ctrlKey, metaKey } = event
 
-  // Use updated options with defaults
-  const mergedOptions = { ...defaultNavigationOptions, ...options }
+	// Use updated options with defaults
+	const mergedOptions = { ...defaultNavigationOptions, ...options }
 
-  // Check for modifier keys first (highest priority)
-  if (ctrlKey || metaKey) {
-    const modifierMap = createModifierKeyboardActionMap(mergedOptions)
-    return modifierMap[key] || null
-  }
+	// Check for modifier keys first (highest priority)
+	if (ctrlKey || metaKey) {
+		const modifierMap = createModifierKeyboardActionMap(mergedOptions)
+		return modifierMap[key] || null
+	}
 
-  // Get the action map based on options
-  const actionMap = createKeyboardActionMap(mergedOptions)
+	// Get the action map based on options
+	const actionMap = createKeyboardActionMap(mergedOptions)
 
-  // Return the action or null if no matching key
-  return actionMap[key] || null
-}
+	// Return the action or null if no matching key
+	return actionMap[key] || null
+}