Skip to content

Commit

Permalink
Merge pull request #25 from NickKaramoff/next
Browse files Browse the repository at this point in the history
  • Loading branch information
kytta authored Apr 26, 2020
2 parents 0e63096 + 45ed135 commit a88a718
Show file tree
Hide file tree
Showing 14 changed files with 223 additions and 478 deletions.
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
.cache
/dev/**/tinybox.js
/dev/**/*.js*
/dev/nuxt/.nuxt/
dist
.idea
Expand Down
8 changes: 7 additions & 1 deletion CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,12 @@
# CHANGELOG

### 1.0.1
## 1.1.0

### New & Improved

- you can now caption your images using the `caption` prop (#24)

## 1.0.1

### New & Improved

Expand Down
11 changes: 6 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -71,11 +71,12 @@ Observe the live demo here: [os.karamoff.dev/vue-tinybox](https://os.karamoff.de

An `Image` object is an object with following fields:

| Field name | Type | Description |
|-------------|----------|-----------------------------------------------------------------------|
| `src` | `String` | The image URL |
| `alt` | `String` | (optional) the alt text |
| `thumbnail` | `String` | (optional) The thumbnail (a smaller, square version of the image) URL |
| Field name | Type | Description |
|-------------|----------|------------------------------------------------------------------|
| `src` | `String` | Image URL |
| `thumbnail` | `String` | (optional) Thumbnail URL. If omitted, the image URL will be used |
| `caption` | `String` | (optional) Caption text to be overlayed on the image |
| `alt` | `String` | (optional) Alt text. If omitted, the caption will be used |

### Props

Expand Down
7 changes: 0 additions & 7 deletions build/defaults.js

This file was deleted.

45 changes: 0 additions & 45 deletions build/plugins.js

This file was deleted.

17 changes: 0 additions & 17 deletions build/rollup.config.dev.js

This file was deleted.

27 changes: 0 additions & 27 deletions build/rollup.config.prod.js

This file was deleted.

11 changes: 9 additions & 2 deletions dev/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,8 @@
}
</style>

<script src="https://cdn.jsdelivr.net/npm/vue@%5E2"></script>
<!-- development version, includes helpful console warnings -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="tinybox.js"></script>
</head>
<body>
Expand Down Expand Up @@ -57,12 +58,18 @@ <h2>vue-tinybox demo: vanilla Vue.js</h2>
src: 'https://picsum.photos/id/13/500/1000',
alt: 'An empty beach',
thumbnail: 'https://picsum.photos/id/13/200',
caption: 'Beach'
},
{
src: 'https://picsum.photos/id/42/1500/600',
alt: 'A café desk',
caption: 'Café'
},
{
src: 'https://picsum.photos/id/256/800/800',
thumbnail: 'https://picsum.photos/id/256/200',
caption: 'Mountain range',
},
'https://picsum.photos/id/256/800/800',
'https://picsum.photos/id/69/800/600',
'https://picsum.photos/id/420/800/600',
],
Expand Down
8 changes: 6 additions & 2 deletions docs/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -144,21 +144,25 @@ <h2>API and more</h2>
{
src: "https://picsum.photos/id/13/600/1000",
alt: "Empty beach",
caption: "Beach",
thumbnail: "https://picsum.photos/id/13/200"
},
{
src: "https://picsum.photos/id/42/800/600",
alt: "Desk in a café",
caption: "Café",
thumbnail: "https://picsum.photos/id/42/200"
},
{
src: "https://picsum.photos/id/256/1500/600",
alt: "Mountains",
alt: "Mountains range",
caption: "Mountains",
thumbnail: "https://picsum.photos/id/256/200"
},
{
src: "https://picsum.photos/id/666/800/600",
alt: "Forest",
alt: "Green trees in forest",
caption: "Forest",
thumbnail: "https://picsum.photos/id/666/200"
}
],
Expand Down
33 changes: 21 additions & 12 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "vue-tinybox",
"version": "1.0.1",
"version": "1.1.0-3",
"description": "A slick, yet tiny lightbox gallery for Vue.js",
"license": "MIT",
"keywords": [
Expand Down Expand Up @@ -30,45 +30,54 @@
"require": "./dist/tinybox.umd.js",
"import": "./dist/tinybox.esm.js"
},
"browser": {
"./sfc": "src/tinybox.vue"
},
"files": [
"dist/tinybox.umd.js",
"dist/tinybox.esm.js",
"src/tinybox.vue"
],
"scripts": {
"build": "rollup --config ./build/rollup.config.prod.js",
"dev:build": "rollup -w --config ./build/rollup.config.dev.js",
"build": "cross-env NODE_ENV=production rollup -c",
"dev:build": "rollup -c -w",
"dev:serve": "sirv ./dev -s -q -D",
"dev": "run-p dev:*",
"test:lint": "eslint .",
"test:size": "size-limit",
"pretest": "yarn build",
"pretest": "run-s build",
"test": "run-p --aggregate-output test:*"
},
"devDependencies": {
"@babel/core": "^7.8.7",
"@babel/preset-env": "^7.8.7",
"@rollup/plugin-node-resolve": "^7.1.1",
"@size-limit/preset-small-lib": "^4.3.1",
"autoprefixer": "^9.7.4",
"@babel/core": "^7.9.0",
"@babel/preset-env": "^7.9.5",
"@rollup/plugin-node-resolve": "^7.1.3",
"@size-limit/preset-small-lib": "^4.4.5",
"autoprefixer": "^9.7.6",
"cross-env": "^7.0.2",
"eslint": "^6.8.0",
"eslint-config-airbnb-base": "^14.1.0",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-vue": "^6.2.2",
"npm-run-all": "^4.1.5",
"postcss": "^7.0.27",
"rollup": "^1.32.1",
"rollup": "^2.7.2",
"rollup-plugin-babel": "^4.4.0",
"rollup-plugin-terser": "^5.3.0",
"rollup-plugin-vue": "^5.1.6",
"sirv-cli": "^0.4.5",
"size-limit": "^4.3.1",
"size-limit": "^4.4.5",
"vue-eslint-parser": "^7.0.0",
"vue-template-compiler": "^2.6.11"
},
"size-limit": [
{
"path": "dist/tinybox.umd.js",
"limit": "3 KB",
"webpack": false
},
{
"path": "dist/tinybox.esm.js",
"limit": "3 KB"
}
],
Expand Down
65 changes: 65 additions & 0 deletions rollup.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
import babel from 'rollup-plugin-babel';
import resolve from '@rollup/plugin-node-resolve';
import { terser } from 'rollup-plugin-terser';
import vue from 'rollup-plugin-vue';

import autoprefixer from 'autoprefixer';

const name = 'Tinybox';
const outFilename = (infix) => `./dist/tinybox.${infix}.js`;

const production = process.env.NODE_ENV === 'production' && !process.env.ROLLUP_WATCH;

const output = [];
const plugins = [
resolve(),
vue({
css: true,
style: {
postcssPlugins: [
autoprefixer,
],
},
template: {
isProduction: production,
compilerOptions: {
whitespace: 'condense',
},
},
}),
production && babel({
presets: [
'@babel/env',
],
}),
];

if (production) {
output.push(
{
file: outFilename('esm'),
format: 'esm',
name,
plugins: [terser({ output: { ecma: 6 } })],
},
{
file: outFilename('umd'),
format: 'umd',
name,
plugins: [terser({ output: { ecma: 5 } })],
},
);
plugins.push();
} else {
output.push({
file: './dev/tinybox.js',
format: 'umd',
name,
});
}

export default {
input: './src/index.js',
output,
plugins,
};
13 changes: 7 additions & 6 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -1,22 +1,23 @@
import component from './tinybox.vue';

function install(Vue) {
// executed by Vue.use()
const install = (Vue) => {
if (install.installed) return;
install.installed = true;

Vue.component(component.name, component);
}
};

let GlobalVue = null;

// auto-install when Vue is found
let GlobalVue = null;
if (typeof window !== 'undefined') {
GlobalVue = window.Vue;
} else if (typeof global !== 'undefined') {
GlobalVue = global.Vue;
}

if (GlobalVue) {
install(GlobalVue);
GlobalVue.use({ install });
}

// to allow module use
export default component;
Loading

0 comments on commit a88a718

Please sign in to comment.