Skip to content

Commit

Permalink
feat: migrate to @angular/cli and angular 8
Browse files Browse the repository at this point in the history
BREAKING CHANGE: library name is changed from angular-sortablejs to ngx-sortablejs
  • Loading branch information
smnbbrv committed May 31, 2019
1 parent 4f5943d commit 1139699
Show file tree
Hide file tree
Showing 51 changed files with 16,486 additions and 508 deletions.
6 changes: 3 additions & 3 deletions .editorconfig
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
# editorconfig.org
# Editor configuration, see https://editorconfig.org
root = true

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

[*.md]
max_line_length = 0
max_line_length = off
trim_trailing_whitespace = false
53 changes: 42 additions & 11 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,15 +1,46 @@
node_modules
dist
codegen
# See http://help.github.com/ignore-files/ for more about ignoring files.

# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out

# dependencies
/node_modules

# profiling files
chrome-profiler-events.json
speed-measure-plugin.json

# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace

# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*

# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
*.bak
*.tgz
*.idea
yarn-error.log
testem.log
/typings

#System Files
# System Files
.DS_Store
Thumbs.db
*.iml

#yarn
yarn-error.log
22 changes: 22 additions & 0 deletions .releaserc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"plugins": [
"@semantic-release/commit-analyzer",
"@semantic-release/release-notes-generator",
"@semantic-release/changelog",
[
"@semantic-release/npm",
{
"pkgRoot": "dist/ngx-sortablejs"
}
],
[
"@semantic-release/git",
{
"assets": [
"CHANGELOG.md"
],
"message": "chore: release ${nextRelease.version} [ci skip]"
}
]
]
}
42 changes: 42 additions & 0 deletions .travis.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
dist: trusty
sudo: false
language: node_js

node_js:
- '10'

addons:
apt:
sources:
- google-chrome
packages:
- google-chrome-stable

branches:
only:
- master

jobs:
include:
- stage: test
script:
- npm run lint
- npm run test:app:ci
- npm run test:lib:ci
- npm run coveralls
- stage: deploy
script:
- npm run build:lib
- cp README.md dist/ngx-sortablejs
- cp LICENSE.md dist/ngx-sortablejs
- npm run build:app
- cp dist/ngx-sortablejs-app/index.html dist/ngx-sortablejs-app/404.html
- npx semantic-release
deploy:
- provider: pages
local-dir: dist/ngx-sortablejs-app
skip-cleanup: true
github-token: $GH_TOKEN
keep-history: true
on:
branch: master
41 changes: 7 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# angular-sortablejs
# ngx-sortablejs

This package is an Angular 2+ binding for [Sortable.js](https://github.com/RubaXa/Sortable). Supports standard arrays and Angular `FormArray`.

Expand All @@ -11,7 +11,7 @@ Trees are also supported: [tree with fake root element (\*ngFor once, root can a
## Installation

```sh
npm i sortablejs angular-sortablejs
npm i ngx-sortablejs sortablejs
```

You are configured now. If you use Webpack or Angular CLI go to the usage. If you have SystemJS, that's sad, but you can go to the end of the document to find configuration steps there.
Expand Down Expand Up @@ -123,7 +123,7 @@ The only thing which should be done is assigning the `group` option to the both

```typescript
import { Component } from '@angular/core';
import { SortablejsOptions } from 'angular-sortablejs';
import { SortablejsOptions } from 'ngx-sortablejs';

@Component({
selector: 'my-app',
Expand Down Expand Up @@ -151,13 +151,13 @@ export class AppComponent {

### Drag & drop between two lists: clone mode

The clone mode is similar to the one above (of course the proper Sortablejs settings should be used; see demo). The only important thing is that the `angular-sortablejs` does clone the HTML element but **does not clone the variable** (or `FormControl` in case of `FormArray` input). By default the variable will be taken as is: a primitive will be copied, an object will be referenced.
The clone mode is similar to the one above (of course the proper Sortablejs settings should be used; see demo). The only important thing is that the `ngx-sortablejs` does clone the HTML element but **does not clone the variable** (or `FormControl` in case of `FormArray` input). By default the variable will be taken as is: a primitive will be copied, an object will be referenced.

If you want to clone the item being sorted in a different manner, you can provide `sortablejsCloneFunction` as a parameter. This function receives an item and should return a clone of that item.

```typescript
import { Component } from '@angular/core';
import { SortablejsOptions } from 'angular-sortablejs';
import { SortablejsOptions } from 'ngx-sortablejs';

@Component({
selector: 'my-app',
Expand Down Expand Up @@ -243,33 +243,6 @@ Original events `onAdd`, `onRemove`, `onUpdate` are intercepted by the library i

Important: the original `onAdd` event happens before the `onRemove` event because the original library makes it like that. We change this behavior and call 'onAdd' after the 'onRemove'. If you want to work with original onAdd event you can use `onAddOriginal` which happens before `onRemove`.

## SystemJS configuration
## License

**IMPORTANT:** Follow this only if you have SystemJS. If you have no errors without this step - most likely you don't need it!

Adapt your `systemjs.config.js` (or another place where you configure SystemJS) file with the following:

```javascript
// ...
var map = {
// ...
'angular-sortablejs': 'node_modules/angular-sortablejs/dist/',
'sortablejs/Sortable.min': 'node_modules/sortablejs/Sortable.min.js',
// ...
};
// ...
var packages = {
// ...
'angular-sortablejs': { main: 'index.js', defaultExtension: 'js' },
// ...
};
// ...
var config = {
map: map,
packages: packages
};

System.config(config);
```

This is important to let SystemJS know everything it needs about the dependencies it needs to load.
MIT
158 changes: 158 additions & 0 deletions angular.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,158 @@
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"ngx-sortablejs-app": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/ngx-sortablejs-app",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": []
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "ngx-sortablejs-app:build"
},
"configurations": {
"production": {
"browserTarget": "ngx-sortablejs-app:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "ngx-sortablejs-app:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "ngx-sortablejs-app:serve"
},
"configurations": {
"production": {
"devServerTarget": "ngx-sortablejs-app:serve:production"
}
}
}
}
},
"ngx-sortablejs": {
"projectType": "library",
"root": "projects/ngx-sortablejs",
"sourceRoot": "projects/ngx-sortablejs/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-ng-packagr:build",
"options": {
"tsConfig": "projects/ngx-sortablejs/tsconfig.lib.json",
"project": "projects/ngx-sortablejs/ng-package.json"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "projects/ngx-sortablejs/src/test.ts",
"tsConfig": "projects/ngx-sortablejs/tsconfig.spec.json",
"karmaConfig": "projects/ngx-sortablejs/karma.conf.js"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"projects/ngx-sortablejs/tsconfig.lib.json",
"projects/ngx-sortablejs/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}},
"defaultProject": "ngx-sortablejs-app"
}
12 changes: 12 additions & 0 deletions browserslist
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries

# You can see what browsers were selected by your queries by running:
# npx browserslist

> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11 # For IE 9-11 support, remove 'not'.
Loading

0 comments on commit 1139699

Please sign in to comment.