open-index/open-npm huggingface dataset:
npm package: @qds.dev/motion
Description: Create a Qwik library
Latest version: 0.14.3

# @qds.dev/motion

> [!IMPORTANT]
> **WORK IN PROGRESS**
> This library is under active construction. The APIs and features described below are currently being implemented.

**A declarative animation library for Qwik, powered by anime.js.**

Inspired by Framer Motion, `@qds.dev/motion` brings powerful, declarative animations to Qwik.

## Features (Planned)

- **Declarative Animations:** Simple prop-based API.
- **Spring Animations:** Physics-based springs for natural motion.
- **Layout Animations:** Automatically animate layout changes with zero config.
- **Timelines:** Orchestrate complex multi-element sequences.
- **Motion Components:** `motion.div`, `motion.button`, etc., available out of the box.
- **Gestures:** Hover, tap, pan, and drag support.

## Installation

_Coming soon..._

## Usage Example (Target API)

Please read the [architecture document](ARCHITECTURE.md) for more details on the approach.

```tsx
import { component$ } from '@qwik.dev/core';
import { motion } from '@qds.dev/motion';

export default component$(() => (
  // animation api's tbd.
  <motion.div
    {...}
  >
    Hello Qwik Motion!
  </motion.div>
));
```
npm package: @qds.dev/utils
Description: Create a Qwik library
Latest version: 0.7.5
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Qwik Library ⚡️

- [Qwik Docs](https://qwik.dev/)
- [Discord](https://qwik.dev/chat)
- [Qwik on GitHub](https://github.com/QwikDev/qwik)
- [@QwikDev](https://twitter.com/QwikDev)
- [Vite](https://vitejs.dev/)
- [Partytown](https://partytown.builder.io/)
- [Mitosis](https://github.com/BuilderIO/mitosis)
- [Builder.io](https://www.builder.io/)

---

## Project Structure

Inside your project, you'll see the following directories and files:

```
├── public/
│   └── ...
└── src/
    ├── components/
    │   └── ...
    └── index.ts
```

- `src/components`: Recommended directory for components.

- `index.ts`: The entry point of your component library, make sure all the public components are exported from this file.

## Development

Development mode uses [Vite's development server](https://vitejs.dev/). For Qwik during development, the `dev` command will also server-side render (SSR) the output. The client-side development modules are loaded by the browser.

```
pnpm dev
```

> Note: during dev mode, Vite will request many JS files, which does not represent a Qwik production build.

## Production

The production build should generate the production build of your component library in (./lib) and the typescript type definitions in (./lib-types).

```
pnpm build
```