Skip to content

Commit

Permalink
Use vite for production builds
Browse files Browse the repository at this point in the history
  • Loading branch information
simonwep committed Jan 5, 2023
1 parent 5f284dc commit 411c2fc
Show file tree
Hide file tree
Showing 42 changed files with 1,447 additions and 1,286 deletions.
3 changes: 2 additions & 1 deletion .eslintrc
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,8 @@
}
},
"rules": {
"react/react-in-jsx-scope": "off"
"react/react-in-jsx-scope": "off",
"react/prop-types": "off"
}
},
{
Expand Down
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
node_modules
lib
dist
.psd
*.iml
.idea/
Expand Down
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@
<a href="https://github.com/Simonwep/selection/actions?query=workflow%3ACI"><img
alt="Build Status"
src="https://github.com/Simonwep/selection/workflows/CI/badge.svg"></a>
<img alt="gzip size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/vanilla/lib/viselect.esm.js?compression=gzip">
<img alt="brotli size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/vanilla/lib/viselect.esm.js?compression=brotli">
<img alt="gzip size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/vanilla/dist/viselect.esm.js?compression=gzip">
<img alt="brotli size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/vanilla/dist/viselect.esm.js?compression=brotli">
<a href="https://v3.vuejs.org"><img
alt="Vue support"
src="https://img.shields.io/badge/✔-vue-%2340B581"></a>
Expand Down
1,965 changes: 1,096 additions & 869 deletions package-lock.json

Large diffs are not rendered by default.

40 changes: 19 additions & 21 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,40 +4,38 @@
"private": true,
"license": "MIT",
"scripts": {
"dev": "lerna run dev",
"build": "lerna run build",
"lint": "eslint 'packages/**/{src,demo}/*.{ts,tsx,vue,js}'",
"lint:fix": "npm run lint -- --fix",
"test:ci": "npm run lint:fix && npm run build"
},
"workspaces": [
"packages/*"
],
"workspaces": {
"packages": [
"packages/*"
]
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.47.1",
"@typescript-eslint/parser": "^5.47.1",
"@vue/eslint-config-typescript": "^11.0.2",
"@rollup/plugin-replace": "^5.0.2",
"@rollup/plugin-terser": "^0.2.1",
"@rollup/plugin-alias": "^4.0.2",
"@vitejs/plugin-vue": "^4.0.0",
"@vitejs/plugin-react": "^3.0.0",
"@preact/preset-vite": "^2.5.0",
"@vue/compiler-sfc": "^3.2.45",
"@types/react": "^18.0.26",
"@types/react-dom": "^18.0.10",
"eslint": "^8.30.0",
"@typescript-eslint/eslint-plugin": "^5.48.0",
"@typescript-eslint/parser": "^5.48.0",
"@vitejs/plugin-react": "^3.0.1",
"@vitejs/plugin-vue": "^4.0.0",
"@vue/compiler-sfc": "^3.2.45",
"@vue/eslint-config-typescript": "^11.0.2",
"eslint": "^8.31.0",
"eslint-plugin-react": "^7.31.11",
"eslint-plugin-vue": "^9.8.0",
"lerna": "^6.3.0",
"rollup": "^3.9.0",
"rollup-plugin-ts": "^3.0.2",
"typescript": "^4.9.4",
"vite": "^4.0.3",
"vue": "^3.2.45",
"vue-tsc": "^1.0.18",
"preact": "^10.11.3",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"preact": "^10.11.3"
"typescript": "^4.9.4",
"vite": "^4.0.4",
"vite-plugin-banner": "^0.7.0",
"vite-plugin-dts": "^1.7.1",
"vue": "^3.2.45",
"vue-tsc": "^1.0.22"
}
}
25 changes: 4 additions & 21 deletions packages/preact/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@
<a href="https://github.com/Simonwep/selection/actions?query=workflow%3ACI"><img
alt="Build Status"
src="https://github.com/Simonwep/selection/workflows/CI/badge.svg"></a>
<img alt="gzip size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/preact/lib/viselect.esm.js?compression=gzip">
<img alt="brotli size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/preact/lib/viselect.esm.js?compression=brotli">
<img alt="gzip size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/preact/dist/viselect.mjs?compression=gzip">
<img alt="brotli size" src="https://img.badgesize.io/https://cdn.jsdelivr.net/npm/@viselect/preact/dist/viselect.mjs?compression=brotli">
<a href="https://v3.vuejs.org"><img
alt="Vue support"
src="https://img.shields.io/badge/✔-vue-%2340B581"></a>
Expand All @@ -47,29 +47,12 @@

### Installation

#### Via package manager
Install using your package manager of choice:

```
$ npm install @viselect/preact
# or
$ yarn add @viselect/preact
npm install @viselect/preact
```

#### Via script tags

```html

<script src="https://cdn.jsdelivr.net/npm/@viselect/preact/lib/viselect.cjs.js"></script>
```

##### Via ES6 import

```js
import SelectionArea from 'https://cdn.jsdelivr.net/npm/@viselect/preact/lib/viselect.esm.js';
```

### Getting started

Last but not least you'll need to add some basic styles to make your selection-area visible:

```css
Expand Down
19 changes: 14 additions & 5 deletions packages/preact/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,26 @@
"name": "@viselect/preact",
"version": "3.2.3",
"description": "Preact wrapper around the viselect vanilla library",
"main": "./lib/viselect.cjs.js",
"module": "./lib/viselect.esm.js",
"author": "Simon Reinisch <contact@reinisch.io>",
"bugs": "https://github.com/Simonwep/selection/issues",
"homepage": "https://github.com/Simonwep/selection#readme",
"repository": "git+https://github.com/Simonwep/selection.git",
"license": "MIT",
"main": "./dist/viselect.umd.js",
"module": "./dist/viselect.mjs",
"types": "./dist/index.d.ts",
"exports": {
".": {
"import": "./dist/viselect.mjs",
"require": "./dist/viselect.umd.js"
}
},
"scripts": {
"build": "rollup -c rollup.config.mjs",
"build": "vite build",
"dev": "vite"
},
"files": [
"lib",
"src"
"dist"
],
"keywords": [
"preact",
Expand All @@ -31,6 +37,9 @@
"peerDependencies": {
"preact": ">=10.5.15"
},
"dependencies": {
"@viselect/react": "~3.2.3"
},
"publishConfig": {
"access": "public"
}
Expand Down
57 changes: 0 additions & 57 deletions packages/preact/rollup.config.mjs

This file was deleted.

44 changes: 44 additions & 0 deletions packages/preact/src/SelectionArea.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
/* eslint-disable no-use-before-define */
import VanillaSelectionArea from '@viselect/vanilla';
import {SelectionEvents, SelectionOptions} from '@viselect/vanilla';
import {createRef, FunctionalComponent} from 'preact';
import {HTMLAttributes} from 'preact/compat';
import {useEffect} from 'preact/hooks';

export interface SelectionAreaProps extends Omit<Partial<SelectionOptions>, 'boundaries'>, HTMLAttributes<HTMLDivElement> {
id?: string;
className?: string;
onBeforeStart?: SelectionEvents['beforestart'];
onBeforeDrag?: SelectionEvents['beforedrag'];
onStart?: SelectionEvents['start'];
onMove?: SelectionEvents['move'];
onStop?: SelectionEvents['stop'];
}

export const SelectionArea: FunctionalComponent<SelectionAreaProps> = props => {
const root = createRef();

useEffect(() => {
const {onBeforeStart, onBeforeDrag, onStart, onMove, onStop, ...opt} = props;
const areaBoundaries = root.current as HTMLElement;

const selection = new VanillaSelectionArea({
boundaries: areaBoundaries,
...opt
});

onBeforeStart && selection.on('beforestart', onBeforeStart);
onBeforeDrag && selection.on('beforedrag', onBeforeDrag);
onStart && selection.on('start', onStart);
onMove && selection.on('move', onMove);
onStop && selection.on('stop', onStop);

return () => selection.destroy();
}, []);

return (
<div ref={root} className={props.className} id={props.id}>
{props.children}
</div>
);
};
6 changes: 3 additions & 3 deletions packages/preact/src/index.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import {SelectionArea} from '@react/SelectionArea';
export {default as VanillaSelectionArea} from '@vanilla/index';
export * from '@vanilla/types';
import {SelectionArea} from './SelectionArea';
export {default as VanillaSelectionArea} from '@viselect/vanilla';
export * from '@viselect/vanilla';
export default SelectionArea;
1 change: 1 addition & 0 deletions packages/preact/src/typings.d.ts
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
/// <reference types="vite/client" />
declare const VERSION: string;
31 changes: 20 additions & 11 deletions packages/preact/tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,13 +1,22 @@
{
"extends": "../../tsconfig.json",
"include": ["./src", "./demo"],
"compilerOptions": {
"declarationDir": "lib",
"allowJs": false,
"skipLibCheck": false,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"isolatedModules": true,
"jsx": "react"
}
"references": [{ "path": "./tsconfig.node.json" }],
"include": ["src", "demo"],
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"lib": ["DOM", "DOM.Iterable", "ESNext"],
"allowJs": false,
"skipLibCheck": true,
"esModuleInterop": false,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "ESNext",
"moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
"jsxImportSource": "preact"
}
}
9 changes: 9 additions & 0 deletions packages/preact/tsconfig.node.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
{
"include": ["vite.config.ts"],
"compilerOptions": {
"composite": true,
"module": "ESNext",
"moduleResolution": "Node",
"allowSyntheticDefaultImports": true
}
}
39 changes: 29 additions & 10 deletions packages/preact/vite.config.ts
Original file line number Diff line number Diff line change
@@ -1,27 +1,46 @@
import preact from '@preact/preset-vite';
import {resolve} from 'path';
import {defineConfig} from 'vite';
import banner from 'vite-plugin-banner';
import dts from 'vite-plugin-dts';
import {version} from './package.json';

export default defineConfig({
root: './demo',
const header = `/*! @viselect/preact v${version} MIT | https://github.com/Simonwep/selection/tree/master/packages/preact */`;

plugins: [preact()],
export default defineConfig(env => ({
root: env.mode === 'production' ? '.' : './demo',

plugins: [preact(), banner(header), dts()],

resolve: {
alias: {
'@vanilla': resolve(__dirname, '../vanilla/src'),
'@react': resolve(__dirname, '../react/src'),
'react': 'preact',
'react-dom': 'preact/compat'
'react': 'preact/compat'
}
},

build: {
sourcemap: true,
minify: 'esbuild',
lib: {
entry: 'src/index.tsx',
name: 'SelectionArea',
fileName: 'viselect',
},
rollupOptions: {
external: ['preact', '@viselect/react'],
output: {
globals: {
preact: 'Preact',
'@viselect/react': 'SelectionArea'
},
},
},
},

server: {
port: 3007
port: 3006
},

define: {
'VERSION': JSON.stringify(version)
}
});
}));
Loading

0 comments on commit 411c2fc

Please sign in to comment.