Full Code of surmon-china/vue-awesome-swiper for AI

Repository: surmon-china/vue-awesome-swiper
Branch: main
Commit: a86323ec39f1
Files: 12
Total size: 13.9 KB

Directory structure:
gitextract_oaknr_o6/

├── .editorconfig
├── .github/
│   └── workflows/
│       ├── publish.yml
│       └── release.yml
├── .gitignore
├── CHANGELOG.md
├── LICENSE
├── README.md
├── index.d.ts
├── index.js
├── package.json
├── scripts/
│   └── release.sh
└── tsconfig.json

================================================
FILE CONTENTS
================================================

================================================
FILE: .editorconfig
================================================
root = true

[*]
indent_style = space
indent_size = 2
tab_width = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true


================================================
FILE: .github/workflows/publish.yml
================================================
# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
# Fork from: https://github.com/actions/starter-workflows/blob/master/ci/npm-publish.yml

name: Publish

on:
  release:
    types: [created]
  push:
    tags:
      - 'v*'

jobs:
  publish-npm:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@v1
        with:
          node-version: 14
          registry-url: https://registry.npmjs.org/
      - run: npm publish
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}


================================================
FILE: .github/workflows/release.yml
================================================
# https://github.com/actions/create-release
name: Release

on:
  push:
    tags:
      - 'v*'

jobs:
  build:
    name: Create Release
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@master

      - name: Create Release
        id: create_release
        uses: actions/create-release@latest
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
        with:
          tag_name: ${{ github.ref }}
          release_name: ${{ github.ref }}
          draft: false
          prerelease: false


================================================
FILE: .gitignore
================================================
# Logs
logs
*.log
npm-debug.log
selenium-debug.log
npm-debug.log*

# output
dist
dist/*

# System
.DS_Store

# Optional npm cache directory
.npm
# node-waf configuration
.lock-wscript

# Package
package-lock.json

# Test
tests/unit/coverage
tests/e2e/reports

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# Dependency directories
node_modules
node_modules/

.vscode


================================================
FILE: CHANGELOG.md
================================================

# Changelog
All notable changes to this project will be documented in this file.

### 5.0.0 (2022-03-19) ⚠️

- Deprecated component
- Bridge to `swiper/vue`
- Upgrade to Vue3

### 4.1.1 (2020-04-21)

**Fixed**
- [#632](https://github.com/surmon-china/vue-awesome-swiper/issues/632) Slide component auto update when `SwiperComponent.autuUpdate`

### 4.1.0 (2020-03-29)

**Update**
- Upgrade abc-factory
- Update test spec
- Vue SFC component to `render`
- Move `types` to `dist`

**Features**
- Support Custom build with Swiper

**Fixed**
- [#422](https://github.com/surmon-china/vue-awesome-swiper/issues/422)
- [#527](https://github.com/surmon-china/vue-awesome-swiper/issues/527)
- [#621](https://github.com/surmon-china/vue-awesome-swiper/issues/621)

### [4.0.4](https://github.com/surmon-china/vue-awesome-swiper/compare/v4.0.3...v4.0.4) (2020-03-22)

**Fixed**
- Event `click-slide` condition with `!swiper.destroyed`

### [4.0.3](https://github.com/surmon-china/vue-awesome-swiper/compare/v4.0.2...v4.0.3) (2020-03-21)

**Fixed**
- Directive instancing when `swiper.destroyed`

### [4.0.1](https://github.com/surmon-china/vue-awesome-swiper/compare/v4.0.0...v4.0.1) (2020-03-20)

**Fixed**
- Publish CI scripts `build`

### [4.0.0-rc.1](https://github.com/surmon-china/vue-awesome-swiper/compare/v4.0.0-rc.0...v4.0.0-rc.1) (2020-03-20)

**Fixed**
- `@clicks-lide` get event path from `event.composedPath()` ~~`event.path`~~

**Update**
- Rename `update` to `updateSwiper`
- Rename `destroy` to `destroySwiper`
- Rename `autoReLoop` to `autoReLoopSwiper`

### [4.0.0-rc.0](https://github.com/surmon-china/vue-awesome-swiper/compare/v3.1.3...v4.0.0-rc.0) (2020-03-19)

**Breaking change**
- Remove vue1 support
- Remove bower support
- Upgrade to Swiper5
- Move Swiper dependencie to `peerDependencies`
- Replace Swiper instance name to `$swiper`
- Merge SSR (Directive) file to the lib core
- Update the component name
  - `swiper` to `Swiper`
  - `swiperSlide` to `SwiperSlide`
- Does not merge options object

**Removed**
- Move examples to [github.surmon.me](https://github.surmon.me/vue-awesome-swiper/)

**Features**
- Add `@click-slide` event (For `loop` mode)
- Add `directive`
- Add prop `autoUpdate`
- Add prop `autoDestroy`
- Add prop `deleteInstanceOnDestroy`
- Add prop `cleanupStylesOnDestroy` [PR #388](https://github.com/surmon-china/vue-awesome-swiper/pull/388)

**Fixed**

Loop mode:
- [#593](https://github.com/surmon-china/vue-awesome-swiper/issues/593)
- [#544](https://github.com/surmon-china/vue-awesome-swiper/issues/544)
- [PR #545](https://github.com/surmon-china/vue-awesome-swiper/pull/545)

Destory:
- [PR #593](https://github.com/surmon-china/vue-awesome-swiper/pull/550)
- [PR #341](https://github.com/surmon-china/vue-awesome-swiper/pull/341)
- [PR #388](https://github.com/surmon-china/vue-awesome-swiper/pull/388)
- [#340](https://github.com/surmon-china/vue-awesome-swiper/issues/340)

Event:
- [PR #377](https://github.com/surmon-china/vue-awesome-swiper/pull/377)

### v3.1.3
- fixed bug with swiper inside transition. #276

### v3.1.2
- update webpack config and rebuild.

### v3.1.1
- fix emit event in browser

### v3.1.0
- fix loop bug
- [bind swiper events to vuejs events](https://github.com/surmon-china/vue-awesome-swiper/pull/238)

### v3.0.7
- remove reloop function
- update ssr example

### v3.0.5
- update swiper version to v4.0.7

### v3.0.4
- fix object assign in spa

### v3.0.3
- fix reLoop method [#205](https://github.com/surmon-china/vue-awesome-swiper/issues/205)

### v3.0.2
- fix ssr build bug

### v3.0.1
- fix the es module export issue

### v3.0.0

#### use
- add global default options
- update the options assign logic
- Update to [Swiper4](http://www.swiper.com.cn)

#### project
- add brower support
- add test scripts
- update babel and webpack configs


================================================
FILE: LICENSE
================================================
MIT License

Copyright (c) 2020 Surmon

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.


================================================
FILE: README.md
================================================
<p></p>
<p align="center">
  <a href="https://swiperjs.com" target="_blank">
    <img width="77px" src="/presses/swiper-logo.svg" />
  </a>
  <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
  <a href="https://vuejs.org" target="_blank">
    <img width="79px" src="/presses/vue-logo.png" />
  </a>
</p>

# vue-awesome-swiper
[![vue](https://img.shields.io/badge/MADE%20WITH-VUE-42a97a?style=for-the-badge&labelColor=35495d)](https://vuejs.org)
&nbsp;
[![GitHub stars](https://img.shields.io/github/stars/surmon-china/vue-awesome-swiper.svg?style=for-the-badge)](https://github.com/surmon-china/vue-awesome-swiper/stargazers)
&nbsp;
[![GitHub issues](https://img.shields.io/github/issues/surmon-china/vue-awesome-swiper.svg?style=for-the-badge)](https://github.com/surmon-china/vue-awesome-swiper/issues)
&nbsp;
[![npm](https://img.shields.io/npm/v/vue-awesome-swiper?color=c7343a&label=npm&style=for-the-badge)](https://www.npmjs.com/package/vue-awesome-swiper)
&nbsp;
[![license](https://img.shields.io/github/license/mashape/apistatus.svg?style=for-the-badge)](/LICENSE)


**[Swiper](https://swiperjs.com)** component for Vue.

---

### DEPRECATED ⚠️

The **vue-awesome-swiper** project has been **deprecated** and superseded by [Swiper Vue component](https://swiperjs.com/vue), a TypeScript friendly project which is a recent official release provided by [Swiper](https://swiperjs.com/). For better stability, please migrate as soon as possible.

**vue-awesome-swiper** released its last version **v5** for (bridge) transition. It's worth noting that APIs in this version are completely **NOT compatible** with that of previous version, it only [re-exports](/index.js) [`swiper/vue`](https://swiperjs.com/vue) and **only supports Vue3**, which means only functions of `swiper/vue` are available. For example, the following code is fully equivalent in `vue-awesome-swiper@5`. And if you want to check update catelog of Swiper API, please refer to [Swiper Changelog](https://swiperjs.com/changelog).

```ts
import { Swiper, SwiperSlide, /* rest swiper/vue API... */ } from 'vue-awesome-swiper'
// exactly equivalent to
import { Swiper, SwiperSlide, /* rest swiper/vue API... */ } from 'swiper/vue'
```

If you need to use older versions of vue-awesome-swiper, you can find the corresponding version number below. Feel free to fork our code and maintain your own copy.

### Legacy versions
- Swiper 5-6 [vue-awesome-swiper@4.1.1](https://github.com/surmon-china/vue-awesome-swiper/tree/v4.1.1) (Vue2)
- Swiper 4.x [vue-awesome-swiper@3.1.3](https://github.com/surmon-china/vue-awesome-swiper/tree/v3.1.3) (Vue2)
- Swiper 3.x [vue-awesome-swiper@2.6.7](https://github.com/surmon-china/vue-awesome-swiper/tree/v2.6.7) (Vue2)

---

### Documentation
- [Examples (Vue3)](https://github.surmon.me/vue-awesome-swiper)
- [Examples (Vue2)](https://v1.github.surmon.me/vue-awesome-swiper)
- [Swiper API](https://swiperjs.com/swiper-api)
- [Swiper Vue (3)](https://swiperjs.com/vue)
- [Swiper issues](https://github.com/nolimits4web/swiper/issues?q=is%3Aissue+is%3Aopen+label%3AVue)
- [Swiper discussions](https://github.com/nolimits4web/swiper/discussions)

### How to use

#### Install

``` bash
npm install swiper vue-awesome-swiper --save
```

```bash
yarn add swiper vue-awesome-swiper
```

#### Local component

```vue
<template>
  <swiper :modules="modules" :pagination="{ clickable: true }">
    <swiper-slide>Slide 1</swiper-slide>
    <swiper-slide>Slide 2</swiper-slide>
    <swiper-slide>Slide 3</swiper-slide>
  </swiper>
</template>

<script>
  import SwiperClass, { Pagination } from 'swiper'
  import { Swiper, SwiperSlide } from 'vue-awesome-swiper'

  // import swiper module styles
  import 'swiper/css'
  import 'swiper/css/pagination'
  // more module style...

  export default {
    components: {
      Swiper,
      SwiperSlide
    },
    setup() {
      return {
        modules: [Pagination]
      }
    }
  }
</script>
```

#### Global component

```javascript
import { createApp } from 'vue'
import SwiperClass, { /* swiper modules... */ } from 'swiper'
import VueAwesomeSwiper from 'vue-awesome-swiper'

// import swiper module styles
import 'swiper/css'
// more module style...

// use swiper modules
SwiperClass.use([/* swiper modules... */])

const app = createApp()
app.use(VueAwesomeSwiper)
```

### Component API

```html
<!-- All options and events of the original Swiper are supported -->
<swiper
  :modules="..."
  :allow-touch-move="false"
  :slides-per-view="1"
  :autoplay="{ delay: 3500, disableOnInteraction: false }"
  @swiper="..."
  @slide-change="..."
  @transition-start="..."
  ...
>
  <template #container-start><span>Container start</span></template>
  <template #wrapper-start><span>Wrapper start</span></template>
  <swiper-slide>Slide 1<swiper-slide>
  <swiper-slide v-slot="{ isActive }">Slide 2 {{ isActive }}<swiper-slide>
  <swiper-slide>Slide 3<swiper-slide>
  <template #wrapper-end><span>Wrapper end</span></template>
  <template #container-end><span>Container end</span></template>
</swiper>
```

### Changelog

Detailed changes for each release are documented in the [release notes](/CHANGELOG.md).

### License

Licensed under the [MIT](/LICENSE) License.



================================================
FILE: index.d.ts
================================================
/**
 * @file vue-awesome-swiper
 * @author Surmon <https://github.com/surmon-china>
 */

import type { App } from 'vue';
import { Swiper, SwiperSlide } from 'swiper/vue';

export * from 'swiper/vue';

declare const _default: {
  Swiper: typeof Swiper;
  SwiperSlide: typeof SwiperSlide;
  install(app: App): void;
};

export default _default;


================================================
FILE: index.js
================================================
/**
 * @file vue-awesome-swiper
 * @author Surmon <https://github.com/surmon-china>
 */

import { Swiper, SwiperSlide } from 'swiper/vue';
export * from 'swiper/vue';
export default {
  Swiper: Swiper,
  SwiperSlide: SwiperSlide,
  install(app) {
    app.component('Swiper', Swiper);
    app.component('SwiperSlide', SwiperSlide);
  }
};


================================================
FILE: package.json
================================================
{
  "name": "vue-awesome-swiper",
  "description": "Swiper component for Vue",
  "version": "5.0.0",
  "author": "Surmon",
  "keywords": [
    "vue swiper",
    "vue awesome swiper",
    "vue carrousel",
    "carrousel",
    "swiper"
  ],
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "https://github.com/surmon-china/vue-awesome-swiper"
  },
  "bugs": "https://github.com/surmon-china/vue-awesome-swiper/issues",
  "homepage": "https://github.surmon.me/vue-awesome-swiper",
  "type": "module",
  "types": "index.d.ts",
  "module": "index.js",
  "browser": "index.js",
  "jsdelivr": "index.js",
  "unpkg": "index.js",
  "main": "index.js",
  "jspm": {
    "main": "index.js",
    "registry": "npm",
    "format": "esm"
  },
  "files": [
    "index.d.ts",
    "index.js"
  ],
  "scripts": {
    "release": ". ./scripts/release.sh"
  },
  "peerDependencies": {
    "swiper": "^7.0.0  || ^8.0.0",
    "vue": "3.x"
  },
  "devDependencies": {
    "swiper": "^8.0.0",
    "vue": "^3.2.31",
    "typescript": "^4.5.4"
  }
}


================================================
FILE: scripts/release.sh
================================================
#!/bin/sh

set -e

PKG_VERSION=$(jq -r '.version' package.json)

git fetch origin v"$PKG_VERSION" || {
  npx standard-version --skip.changelog --skip.commit -a --release-as "$PKG_VERSION"
  git push --follow-tags origin main
}


================================================
FILE: tsconfig.json
================================================
{
  "compilerOptions": {
    "module": "esnext",
    "target": "ES6",
    "lib": ["ESNext"],
    "strict": true,
    "esModuleInterop": true,
    "moduleResolution": "node",
    "declaration": true,
    "skipLibCheck": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "outDir": "dist"
  }
}