@sky.ui/core 0.0.41 → 0.0.43

package/dist/helper/controllers/animation-controller.d.ts

@@ -1,8 +1,8 @@
-import type { ReactiveController, ReactiveControllerHost } from "lit";
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
 /** Fill mode for WAAPI (KeyframeEffectOptions). */
-export type FillMode = "none" | "forwards" | "backwards" | "both";
+export type FillMode = 'none' | 'forwards' | 'backwards' | 'both';
 /** Playback direction for WAAPI (KeyframeEffectOptions). */
-export type AnimationDirection = "normal" | "reverse" | "alternate" | "alternate-reverse";
+export type AnimationDirection = 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';
 /**
  * Options for a single animation run (Web Animations API).
  * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options
@@ -39,7 +39,7 @@ export interface AnimationControllerConfig {
     defaultFill?: FillMode;
 }
 /** Direction for slide presets. */
-export type SlideDirection = "up" | "down" | "left" | "right";
+export type SlideDirection = 'up' | 'down' | 'left' | 'right';
 /**
  * AnimationController – consistent animations via the Web Animations API (WAAPI).
  *

package/dist/helper/controllers/animation-controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"animation-controller.js","sources":["../../../src/helper/controllers/animation-controller.ts"],"sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from \"lit\";\r\n\r\n/** Fill mode for WAAPI (KeyframeEffectOptions). */\r\nexport type FillMode = \"none\" | \"forwards\" | \"backwards\" | \"both\";\r\n\r\n/** Playback direction for WAAPI (KeyframeEffectOptions). */\r\nexport type AnimationDirection =\r\n  | \"normal\"\r\n  | \"reverse\"\r\n  | \"alternate\"\r\n  | \"alternate-reverse\";\r\n\r\n/**\r\n * Options for a single animation run (Web Animations API).\r\n * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options\r\n */\r\nexport interface AnimationOptions {\r\n  /** Duration in milliseconds. */\r\n  duration?: number;\r\n  /** Delay before start in milliseconds. */\r\n  delay?: number;\r\n  /** Easing function (CSS easing or cubic-bezier). */\r\n  easing?: string;\r\n  /** Fill mode: 'none' | 'forwards' | 'backwards' | 'both'. */\r\n  fill?: FillMode;\r\n  /** Number of iterations (default 1). */\r\n  iterations?: number;\r\n  /** Playback direction. */\r\n  direction?: AnimationDirection;\r\n  /** End delay in milliseconds. */\r\n  endDelay?: number;\r\n  /** Unique id for the animation (useful for canceling by id). */\r\n  id?: string;\r\n}\r\n\r\n/**\r\n * Keyframes format accepted by Element.animate().\r\n * @see https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats\r\n */\r\nexport type AnimationKeyframes =\r\n  | Keyframe[]\r\n  | PropertyIndexedKeyframes;\r\n\r\n/**\r\n * Configuration for the controller defaults (used when not overridden per call).\r\n */\r\nexport interface AnimationControllerConfig {\r\n  defaultDuration?: number;\r\n  defaultEasing?: string;\r\n  defaultFill?: FillMode;\r\n}\r\n\r\n/** Direction for slide presets. */\r\nexport type SlideDirection = \"up\" | \"down\" | \"left\" | \"right\";\r\n\r\n/**\r\n * AnimationController – consistent animations via the Web Animations API (WAAPI).\r\n *\r\n * Use as a Lit ReactiveController so components get:\r\n * - Shared defaults (duration, easing, fill)\r\n * - Preset helpers: fadeIn, fadeOut, slideIn, slideOut, scaleIn, scaleOut\r\n * - Low-level animate() for custom keyframes\r\n * - Automatic cancellation of running animations when the host disconnects\r\n *\r\n * @example\r\n * ```ts\r\n * class MyPanel extends LitElement {\r\n *   animation = new AnimationController(this, { defaultDuration: 200, defaultEasing: 'ease-out' });\r\n *\r\n *   async open() {\r\n *     await this.animation.fadeIn(this.panelEl);\r\n *   }\r\n *\r\n *   async close() {\r\n *     await this.animation.fadeOut(this.panelEl);\r\n *   }\r\n * }\r\n * ```\r\n */\r\nexport class AnimationController implements ReactiveController {\r\n  readonly host: ReactiveControllerHost;\r\n  private readonly config: Required<AnimationControllerConfig>;\r\n  private readonly running = new Set<Animation>();\r\n\r\n  constructor(\r\n    host: ReactiveControllerHost,\r\n    config: AnimationControllerConfig = {},\r\n  ) {\r\n    this.host = host;\r\n    this.config = {\r\n      defaultDuration: config.defaultDuration ?? 200,\r\n      defaultEasing: config.defaultEasing ?? \"ease-out\",\r\n      defaultFill: config.defaultFill ?? \"forwards\",\r\n    };\r\n    host.addController(this);\r\n  }\r\n\r\n  hostDisconnected(): void {\r\n    this.running.forEach((a) => {\r\n      try {\r\n        a.cancel();\r\n      } catch {\r\n        // ignore\r\n      }\r\n    });\r\n    this.running.clear();\r\n  }\r\n\r\n  /**\r\n   * Run a WAAPI animation on an element. Returns the Animation for chaining or await .finished.\r\n   * Running animations are tracked and cancelled when the host disconnects.\r\n   */\r\n  animate(\r\n    element: Element | null | undefined,\r\n    keyframes: AnimationKeyframes,\r\n    options: AnimationOptions = {},\r\n  ): Animation | null {\r\n    if (!element) return null;\r\n\r\n    const duration = options.duration ?? this.config.defaultDuration;\r\n    const easing = options.easing ?? this.config.defaultEasing;\r\n    const fill = options.fill ?? this.config.defaultFill;\r\n\r\n    const opts: KeyframeAnimationOptions = {\r\n      duration,\r\n      delay: options.delay ?? 0,\r\n      easing,\r\n      fill,\r\n      iterations: options.iterations ?? 1,\r\n      direction: options.direction ?? \"normal\",\r\n      endDelay: options.endDelay ?? 0,\r\n      id: options.id,\r\n    };\r\n\r\n    const animation = element.animate(keyframes as Keyframe[], opts);\r\n    this.running.add(animation);\r\n    animation.finished\r\n      .then(() => this.running.delete(animation))\r\n      .catch(() => this.running.delete(animation));\r\n    return animation;\r\n  }\r\n\r\n  /**\r\n   * Fade in: opacity 0 → 1.\r\n   */\r\n  fadeIn(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions = {},\r\n  ): Animation | null {\r\n    return this.animate(\r\n      element,\r\n      [{ opacity: 0 }, { opacity: 1 }],\r\n      options,\r\n    );\r\n  }\r\n\r\n  /**\r\n   * Fade out: opacity 1 → 0.\r\n   */\r\n  fadeOut(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions = {},\r\n  ): Animation | null {\r\n    return this.animate(\r\n      element,\r\n      [{ opacity: 1 }, { opacity: 0 }],\r\n      options,\r\n    );\r\n  }\r\n\r\n  /**\r\n   * Slide in from the given direction (translate from off-screen to 0).\r\n   */\r\n  slideIn(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { direction?: SlideDirection } = {},\r\n  ): Animation | null {\r\n    const dir = options.direction ?? \"down\";\r\n    const [fromX, fromY] = slideOffset(dir, true);\r\n    const keyframes: Keyframe[] = [\r\n      { transform: `translate(${fromX}, ${fromY})` },\r\n      { transform: \"translate(0, 0)\" },\r\n    ];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Slide out toward the given direction (translate from 0 to off-screen).\r\n   */\r\n  slideOut(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { direction?: SlideDirection } = {},\r\n  ): Animation | null {\r\n    const dir = options.direction ?? \"up\";\r\n    const [toX, toY] = slideOffset(dir, false);\r\n    const keyframes: Keyframe[] = [\r\n      { transform: \"translate(0, 0)\" },\r\n      { transform: `translate(${toX}, ${toY})` },\r\n    ];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Scale in: scale(0) or scale(0.9) → scale(1). Optionally combine with opacity.\r\n   */\r\n  scaleIn(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { fromScale?: number; opacity?: boolean } = {},\r\n  ): Animation | null {\r\n    const from = options.fromScale ?? 0.95;\r\n    const withOpacity = options.opacity !== false;\r\n    const keyframes: Keyframe[] = withOpacity\r\n      ? [\r\n          { transform: `scale(${from})`, opacity: 0 },\r\n          { transform: \"scale(1)\", opacity: 1 },\r\n        ]\r\n      : [\r\n          { transform: `scale(${from})` },\r\n          { transform: \"scale(1)\" },\r\n        ];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Scale out: scale(1) → scale(0.95) or custom. Optionally combine with opacity.\r\n   */\r\n  scaleOut(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { toScale?: number; opacity?: boolean } = {},\r\n  ): Animation | null {\r\n    const to = options.toScale ?? 0.95;\r\n    const withOpacity = options.opacity !== false;\r\n    const keyframes: Keyframe[] = withOpacity\r\n      ? [\r\n          { transform: \"scale(1)\", opacity: 1 },\r\n          { transform: `scale(${to})`, opacity: 0 },\r\n        ]\r\n      : [\r\n          { transform: \"scale(1)\" },\r\n          { transform: `scale(${to})` },\r\n        ];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Cancel a specific animation (e.g. one you stored from animate() or a preset).\r\n   */\r\n  cancel(animation: Animation): void {\r\n    animation.cancel();\r\n    this.running.delete(animation);\r\n  }\r\n\r\n  /**\r\n   * Cancel all animations currently running for this controller.\r\n   */\r\n  cancelAll(): void {\r\n    this.running.forEach((a) => {\r\n      try {\r\n        a.cancel();\r\n      } catch {\r\n        // ignore\r\n      }\r\n    });\r\n    this.running.clear();\r\n  }\r\n}\r\n\r\nfunction slideOffset(\r\n  direction: SlideDirection,\r\n  isIn: boolean,\r\n): [string, string] {\r\n  const pct = \"100%\";\r\n  switch (direction) {\r\n    case \"up\":\r\n      return [\"0\", isIn ? pct : `-${pct}`];\r\n    case \"down\":\r\n      return [\"0\", isIn ? `-${pct}` : pct];\r\n    case \"left\":\r\n      return [isIn ? pct : `-${pct}`, \"0\"];\r\n    case \"right\":\r\n      return [isIn ? `-${pct}` : pct, \"0\"];\r\n    default:\r\n      return [\"0\", isIn ? `-${pct}` : pct];\r\n  }\r\n}\r\n"],"names":["AnimationController","constructor","host","config","this","running","Set","defaultDuration","defaultEasing","defaultFill","addController","hostDisconnected","forEach","a","cancel","clear","animate","element","keyframes","options","duration","easing","fill","opts","delay","iterations","direction","endDelay","id","animation","add","finished","then","delete","catch","fadeIn","opacity","fadeOut","slideIn","dir","fromX","fromY","slideOffset","transform","slideOut","toX","toY","scaleIn","from","fromScale","scaleOut","to","toScale","cancelAll","isIn","pct"],"mappings":"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"}
+{"version":3,"file":"animation-controller.js","sources":["../../../src/helper/controllers/animation-controller.ts"],"sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from 'lit';\r\n\r\n/** Fill mode for WAAPI (KeyframeEffectOptions). */\r\nexport type FillMode = 'none' | 'forwards' | 'backwards' | 'both';\r\n\r\n/** Playback direction for WAAPI (KeyframeEffectOptions). */\r\nexport type AnimationDirection =\r\n  'normal' | 'reverse' | 'alternate' | 'alternate-reverse';\r\n\r\n/**\r\n * Options for a single animation run (Web Animations API).\r\n * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/KeyframeEffect#options\r\n */\r\nexport interface AnimationOptions {\r\n  /** Duration in milliseconds. */\r\n  duration?: number;\r\n  /** Delay before start in milliseconds. */\r\n  delay?: number;\r\n  /** Easing function (CSS easing or cubic-bezier). */\r\n  easing?: string;\r\n  /** Fill mode: 'none' | 'forwards' | 'backwards' | 'both'. */\r\n  fill?: FillMode;\r\n  /** Number of iterations (default 1). */\r\n  iterations?: number;\r\n  /** Playback direction. */\r\n  direction?: AnimationDirection;\r\n  /** End delay in milliseconds. */\r\n  endDelay?: number;\r\n  /** Unique id for the animation (useful for canceling by id). */\r\n  id?: string;\r\n}\r\n\r\n/**\r\n * Keyframes format accepted by Element.animate().\r\n * @see https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats\r\n */\r\nexport type AnimationKeyframes = Keyframe[] | PropertyIndexedKeyframes;\r\n\r\n/**\r\n * Configuration for the controller defaults (used when not overridden per call).\r\n */\r\nexport interface AnimationControllerConfig {\r\n  defaultDuration?: number;\r\n  defaultEasing?: string;\r\n  defaultFill?: FillMode;\r\n}\r\n\r\n/** Direction for slide presets. */\r\nexport type SlideDirection = 'up' | 'down' | 'left' | 'right';\r\n\r\n/**\r\n * AnimationController – consistent animations via the Web Animations API (WAAPI).\r\n *\r\n * Use as a Lit ReactiveController so components get:\r\n * - Shared defaults (duration, easing, fill)\r\n * - Preset helpers: fadeIn, fadeOut, slideIn, slideOut, scaleIn, scaleOut\r\n * - Low-level animate() for custom keyframes\r\n * - Automatic cancellation of running animations when the host disconnects\r\n *\r\n * @example\r\n * ```ts\r\n * class MyPanel extends LitElement {\r\n *   animation = new AnimationController(this, { defaultDuration: 200, defaultEasing: 'ease-out' });\r\n *\r\n *   async open() {\r\n *     await this.animation.fadeIn(this.panelEl);\r\n *   }\r\n *\r\n *   async close() {\r\n *     await this.animation.fadeOut(this.panelEl);\r\n *   }\r\n * }\r\n * ```\r\n */\r\nexport class AnimationController implements ReactiveController {\r\n  readonly host: ReactiveControllerHost;\r\n  private readonly config: Required<AnimationControllerConfig>;\r\n  private readonly running = new Set<Animation>();\r\n\r\n  constructor(\r\n    host: ReactiveControllerHost,\r\n    config: AnimationControllerConfig = {}\r\n  ) {\r\n    this.host = host;\r\n    this.config = {\r\n      defaultDuration: config.defaultDuration ?? 200,\r\n      defaultEasing: config.defaultEasing ?? 'ease-out',\r\n      defaultFill: config.defaultFill ?? 'forwards',\r\n    };\r\n    host.addController(this);\r\n  }\r\n\r\n  hostDisconnected(): void {\r\n    this.running.forEach((a) => {\r\n      try {\r\n        a.cancel();\r\n      } catch {\r\n        // ignore\r\n      }\r\n    });\r\n    this.running.clear();\r\n  }\r\n\r\n  /**\r\n   * Run a WAAPI animation on an element. Returns the Animation for chaining or await .finished.\r\n   * Running animations are tracked and cancelled when the host disconnects.\r\n   */\r\n  animate(\r\n    element: Element | null | undefined,\r\n    keyframes: AnimationKeyframes,\r\n    options: AnimationOptions = {}\r\n  ): Animation | null {\r\n    if (!element) return null;\r\n\r\n    const duration = options.duration ?? this.config.defaultDuration;\r\n    const easing = options.easing ?? this.config.defaultEasing;\r\n    const fill = options.fill ?? this.config.defaultFill;\r\n\r\n    const opts: KeyframeAnimationOptions = {\r\n      duration,\r\n      delay: options.delay ?? 0,\r\n      easing,\r\n      fill,\r\n      iterations: options.iterations ?? 1,\r\n      direction: options.direction ?? 'normal',\r\n      endDelay: options.endDelay ?? 0,\r\n      id: options.id,\r\n    };\r\n\r\n    const animation = element.animate(keyframes as Keyframe[], opts);\r\n    this.running.add(animation);\r\n    animation.finished\r\n      .then(() => this.running.delete(animation))\r\n      .catch(() => this.running.delete(animation));\r\n    return animation;\r\n  }\r\n\r\n  /**\r\n   * Fade in: opacity 0 → 1.\r\n   */\r\n  fadeIn(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions = {}\r\n  ): Animation | null {\r\n    return this.animate(element, [{ opacity: 0 }, { opacity: 1 }], options);\r\n  }\r\n\r\n  /**\r\n   * Fade out: opacity 1 → 0.\r\n   */\r\n  fadeOut(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions = {}\r\n  ): Animation | null {\r\n    return this.animate(element, [{ opacity: 1 }, { opacity: 0 }], options);\r\n  }\r\n\r\n  /**\r\n   * Slide in from the given direction (translate from off-screen to 0).\r\n   */\r\n  slideIn(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { direction?: SlideDirection } = {}\r\n  ): Animation | null {\r\n    const dir = options.direction ?? 'down';\r\n    const [fromX, fromY] = slideOffset(dir, true);\r\n    const keyframes: Keyframe[] = [\r\n      { transform: `translate(${fromX}, ${fromY})` },\r\n      { transform: 'translate(0, 0)' },\r\n    ];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Slide out toward the given direction (translate from 0 to off-screen).\r\n   */\r\n  slideOut(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { direction?: SlideDirection } = {}\r\n  ): Animation | null {\r\n    const dir = options.direction ?? 'up';\r\n    const [toX, toY] = slideOffset(dir, false);\r\n    const keyframes: Keyframe[] = [\r\n      { transform: 'translate(0, 0)' },\r\n      { transform: `translate(${toX}, ${toY})` },\r\n    ];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Scale in: scale(0) or scale(0.9) → scale(1). Optionally combine with opacity.\r\n   */\r\n  scaleIn(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { fromScale?: number; opacity?: boolean } = {}\r\n  ): Animation | null {\r\n    const from = options.fromScale ?? 0.95;\r\n    const withOpacity = options.opacity !== false;\r\n    const keyframes: Keyframe[] = withOpacity\r\n      ? [\r\n          { transform: `scale(${from})`, opacity: 0 },\r\n          { transform: 'scale(1)', opacity: 1 },\r\n        ]\r\n      : [{ transform: `scale(${from})` }, { transform: 'scale(1)' }];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Scale out: scale(1) → scale(0.95) or custom. Optionally combine with opacity.\r\n   */\r\n  scaleOut(\r\n    element: Element | null | undefined,\r\n    options: AnimationOptions & { toScale?: number; opacity?: boolean } = {}\r\n  ): Animation | null {\r\n    const to = options.toScale ?? 0.95;\r\n    const withOpacity = options.opacity !== false;\r\n    const keyframes: Keyframe[] = withOpacity\r\n      ? [\r\n          { transform: 'scale(1)', opacity: 1 },\r\n          { transform: `scale(${to})`, opacity: 0 },\r\n        ]\r\n      : [{ transform: 'scale(1)' }, { transform: `scale(${to})` }];\r\n    return this.animate(element, keyframes, options);\r\n  }\r\n\r\n  /**\r\n   * Cancel a specific animation (e.g. one you stored from animate() or a preset).\r\n   */\r\n  cancel(animation: Animation): void {\r\n    animation.cancel();\r\n    this.running.delete(animation);\r\n  }\r\n\r\n  /**\r\n   * Cancel all animations currently running for this controller.\r\n   */\r\n  cancelAll(): void {\r\n    this.running.forEach((a) => {\r\n      try {\r\n        a.cancel();\r\n      } catch {\r\n        // ignore\r\n      }\r\n    });\r\n    this.running.clear();\r\n  }\r\n}\r\n\r\nfunction slideOffset(\r\n  direction: SlideDirection,\r\n  isIn: boolean\r\n): [string, string] {\r\n  const pct = '100%';\r\n  switch (direction) {\r\n    case 'up':\r\n      return ['0', isIn ? pct : `-${pct}`];\r\n    case 'down':\r\n      return ['0', isIn ? `-${pct}` : pct];\r\n    case 'left':\r\n      return [isIn ? pct : `-${pct}`, '0'];\r\n    case 'right':\r\n      return [isIn ? `-${pct}` : pct, '0'];\r\n    default:\r\n      return ['0', isIn ? `-${pct}` : pct];\r\n  }\r\n}\r\n"],"names":["AnimationController","constructor","host","config","this","running","Set","defaultDuration","defaultEasing","defaultFill","addController","hostDisconnected","forEach","a","cancel","clear","animate","element","keyframes","options","duration","easing","fill","opts","delay","iterations","direction","endDelay","id","animation","add","finished","then","delete","catch","fadeIn","opacity","fadeOut","slideIn","dir","fromX","fromY","slideOffset","transform","slideOut","toX","toY","scaleIn","from","fromScale","scaleOut","to","toScale","cancelAll","isIn","pct"],"mappings":"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"}

package/dist/helper/controllers/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./animation-controller";
 export * from "./popover-controller";
+export * from "./preset-controller";

package/dist/helper/controllers/index.js

@@ -1,2 +1,2 @@
-export{AnimationController}from"./animation-controller.js";export{PopoverController}from"./popover-controller.js";
+export{AnimationController}from"./animation-controller.js";export{PopoverController}from"./popover-controller.js";export{PresetController}from"./preset-controller.js";
 //# sourceMappingURL=index.js.map

package/dist/helper/controllers/popover-controller.d.ts

@@ -6,7 +6,7 @@ export type MaxWidthMode = "cap" | "fill";
 export type CloseReason = "api" | "toggle" | "escape" | "light-dismiss" | "group";
 type ArrowAlign = "center" | "start" | "end";
 type ScrollContainerMode = "auto" | "window";
-/** ✅ Presets: consumer only names it */
+/** Named animation presets; consumer selects by name. */
 export type PopoverPreset = "none" | "fade" | "scale" | "slide" | "iosMenu" | "iosSheet" | "materialMenu" | "materialSheet" | "floaty" | "soft" | "sharp" | "blurIn" | "blurFade" | "zoomFromAnchor" | "zoomFromCorner" | "flip3d" | "card3d" | "tilt3d" | "depth3d" | "rotate3d" | "springy" | "bouncy" | "glide" | "pop" | "drop" | "grow";
 export type PopoverPresetConfig = {
     enterPx?: number;