Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
grid-layout-plus
Advanced tools
grid-layout-plus - npm Package Compare versions
Comparing version 0.0.0 to 1.0.0-beta.0
| { | ||
| "name": "grip-layout-plus-dev-server", | ||
| "name": "grid-layout-plus-dev-server", | ||
| "private": true, | ||
@@ -4,0 +4,0 @@ "scripts": { |
| import { createRouter, createWebHashHistory } from 'vue-router' | ||
| document.title = 'dev | Grip Layout Plus' | ||
| document.title = 'dev | Grid Layout Plus' | ||
@@ -27,3 +27,3 @@ const demos = import.meta.glob('../docs/demos/*.vue') | ||
| router.afterEach(to => { | ||
| document.title = `select - ${typeof to.name === 'string' ? to.name : 'dev'} | Grip Layout Plus` | ||
| document.title = `select - ${typeof to.name === 'string' ? to.name : 'dev'} | Grid Layout Plus` | ||
| }) |
| { | ||
| "extends": "../tsconfig.json", | ||
| "compilerOptions": { | ||
| "paths": { | ||
| "@/*": ["../src/*"] | ||
| } | ||
| }, | ||
| "include": ["*.vue", "*.ts", "global.d.ts"] | ||
| } |
@@ -1,2 +0,1 @@ | ||
| import { resolve } from 'node:path' | ||
| import { defineConfig } from 'vite' | ||
@@ -8,7 +7,2 @@ import vue from '@vitejs/plugin-vue' | ||
| return { | ||
| resolve: { | ||
| alias: [ | ||
| { find: /^@\/(.+)/, replacement: resolve(__dirname, '../src/$1') } | ||
| ] | ||
| }, | ||
| css: { | ||
@@ -15,0 +9,0 @@ postcss: { |
@@ -0,28 +1,138 @@ | ||
| import { resolve } from 'node:path' | ||
| import { defineConfig } from 'vitepress' | ||
| // https://vitepress.dev/reference/site-config | ||
| export default defineConfig({ | ||
| title: "Docs", | ||
| description: "A VitePress Site", | ||
| vite: { | ||
| logLevel: 'error', | ||
| resolve: { | ||
| alias: { | ||
| 'grid-layout-plus': resolve(__dirname, '../../src') | ||
| } | ||
| } | ||
| }, | ||
| head: [ | ||
| ['link', { rel: 'icon', type: 'image/svg+xml', href: '/grid-layout-plus.svg' }] | ||
| ], | ||
| title: 'Grid Layout Plus', | ||
| lastUpdated: true, | ||
| themeConfig: { | ||
| // https://vitepress.dev/reference/default-theme-config | ||
| nav: [ | ||
| { text: 'Home', link: '/' }, | ||
| { text: 'Examples', link: '/markdown-examples' } | ||
| ], | ||
| sidebar: [ | ||
| { | ||
| text: 'Examples', | ||
| items: [ | ||
| { text: 'Markdown Examples', link: '/markdown-examples' }, | ||
| { text: 'Runtime API Examples', link: '/api-examples' } | ||
| ] | ||
| logo: '/grid-layout-plus.svg', | ||
| outline: [2, 3] | ||
| }, | ||
| locales: { | ||
| root: { | ||
| label: 'English', | ||
| lang: 'en', | ||
| description: 'A draggable and resizable grid layout for Vue 3.', | ||
| themeConfig: { | ||
| nav: [ | ||
| { text: 'Guide', link: '/guide/installation', activeMatch: '/guide/' } | ||
| // { text: 'Playground', link: '/markdown-examples' } | ||
| ], | ||
| sidebar: [ | ||
| { | ||
| text: 'Introduction', | ||
| items: [ | ||
| { text: 'Installation', link: '/guide/installation' }, | ||
| { text: 'Usage', link: '/guide/usage' }, | ||
| { text: 'Properties', link: '/guide/properties' }, | ||
| { text: 'Events', link: '/guide/events' }, | ||
| { text: 'Custom Style', link: '/guide/custom-style' } | ||
| ] | ||
| }, | ||
| { | ||
| text: 'Example', | ||
| items: [ | ||
| { text: 'Basic Usage', link: '/example/basic' }, | ||
| { text: 'Move and Resize Events', link: '/example/events' }, | ||
| { text: 'Multiple Grid Layouts', link: '/example/multiple-grids' }, | ||
| { text: 'Drag and Resize Handler', link: '/example/drag-resize-handler' }, | ||
| { text: 'Mirrored Grid Layout', link: '/example/mirrored' }, | ||
| { text: 'Responsive', link: '/example/responsive' }, | ||
| { text: 'Prevent Collision', link: '/example/prevent-collision' }, | ||
| { text: 'Predefined Responsive Layouts', link: '/example/responsive-layouts' }, | ||
| { text: 'Dynamic Add or Remove', link: '/example/dynamic-add-remove' }, | ||
| { text: 'Drag From Outside', link: '/example/drag-from-outside' }, | ||
| { text: 'Items Bounded to Container', link: '/example/bounded' }, | ||
| { text: 'Styling Grid Lines', link: '/example/styling-grid-lines' }, | ||
| { text: 'Styling Placeholder', link: '/example/styling-placeholder' } | ||
| ] | ||
| } | ||
| ], | ||
| editLink: { | ||
| pattern: 'https://github.com/qmhc/grid-layout-plus/edit/main/docs/en/:path', | ||
| text: 'Edit this page on GitHub' | ||
| }, | ||
| socialLinks: [ | ||
| { icon: 'github', link: 'https://github.com/qmhc/grid-layout-plus' } | ||
| ], | ||
| footer: { | ||
| message: 'Released under the MIT License.', | ||
| copyright: 'Copyright © 2023-present qmhc' | ||
| } | ||
| } | ||
| ], | ||
| socialLinks: [ | ||
| { icon: 'github', link: 'https://github.com/vuejs/vitepress' } | ||
| ] | ||
| }, | ||
| zh: { | ||
| label: '中文', | ||
| lang: 'zh', | ||
| description: '一个 Vue 3 的可拖拽、可缩放的布局', | ||
| themeConfig: { | ||
| nav: [ | ||
| { text: '指南', link: '/zh/guide/installation', activeMatch: '/zh/guide/' } | ||
| // { text: '游乐场', link: '/zh/markdown-examples' } | ||
| ], | ||
| sidebar: [ | ||
| { | ||
| text: '介绍', | ||
| items: [ | ||
| { text: '安装', link: '/zh/guide/installation' }, | ||
| { text: '用法', link: '/zh/guide/usage' }, | ||
| { text: '属性', link: '/zh/guide/properties' }, | ||
| { text: '事件', link: '/zh/guide/events' }, | ||
| { text: '定制样式', link: '/zh/guide/custom-style' } | ||
| ] | ||
| }, | ||
| { | ||
| text: '示例', | ||
| items: [ | ||
| { text: '基础用法', link: '/zh/example/basic' }, | ||
| { text: '移动和缩放事件', link: '/zh/example/events' }, | ||
| { text: '多个栅格布局', link: '/zh/example/multiple-grids' }, | ||
| { text: '拖拽和缩放手柄', link: '/zh/example/drag-resize-handler' }, | ||
| { text: '镜像栅格布局', link: '/zh/example/mirrored' }, | ||
| { text: '响应式', link: '/zh/example/responsive' }, | ||
| { text: '阻止碰撞', link: '/zh/example/prevent-collision' }, | ||
| { text: '预设响应式布局', link: '/zh/example/responsive-layouts' }, | ||
| { text: '动态增减元素', link: '/zh/example/dynamic-add-remove' }, | ||
| { text: '从外部拖入', link: '/zh/example/drag-from-outside' }, | ||
| { text: '元素绑定容器', link: '/zh/example/bounded' }, | ||
| { text: '定制栅格线', link: '/example/styling-grid-lines' }, | ||
| { text: '定制占位符', link: '/example/styling-placeholder' } | ||
| ] | ||
| } | ||
| ], | ||
| editLink: { | ||
| pattern: 'https://github.com/qmhc/grid-layout-plus/edit/main/docs/:path', | ||
| text: '在 GitHub 上编辑此页' | ||
| }, | ||
| socialLinks: [ | ||
| { icon: 'github', link: 'https://github.com/qmhc/grid-layout-plus' } | ||
| ], | ||
| docFooter: { | ||
| prev: '上一页', | ||
| next: '下一页' | ||
| }, | ||
| footer: { | ||
| message: '在 MIT 协议下发布。', | ||
| copyright: 'Copyright © 2023-present qmhc' | ||
| }, | ||
| outlineTitle: '在这一页', | ||
| darkModeSwitchLabel: '切换暗黑模式', | ||
| returnToTopLabel: '返回顶部', | ||
| langMenuLabel: '更换语言', | ||
| sidebarMenuLabel: '菜单', | ||
| lastUpdatedText: '最后更新日期' | ||
| } | ||
| } | ||
| } | ||
| }) |
@@ -1,6 +0,15 @@ | ||
| // https://vitepress.dev/guide/custom-theme | ||
| import { h } from 'vue' | ||
| import Theme from 'vitepress/theme' | ||
| import { install } from 'vexip-ui' | ||
| import { GridLayout, GridItem } from 'grid-layout-plus' | ||
| import { toCapitalCase } from '@vexip-ui/utils' | ||
| import 'vexip-ui/css/index.css' | ||
| import 'vexip-ui/css/dark/index.css' | ||
| import './style.css' | ||
| import type { App } from 'vue' | ||
| const demos = import.meta.glob('../../demos/*.vue', { eager: true }) | ||
| export default { | ||
@@ -13,5 +22,13 @@ ...Theme, | ||
| }, | ||
| enhanceApp({ app, router, siteData }) { | ||
| // ... | ||
| enhanceApp({ app }: { app: App }) { | ||
| app.use(install) | ||
| app.component('GridLayout', GridLayout) | ||
| app.component('GridItem', GridItem) | ||
| Object.keys(demos).forEach(path => { | ||
| const name = toCapitalCase(path.split('/').at(-1)!.replace(/.vue$/, '')) | ||
| app.component(`Demo${name}`, (demos[path] as any).default) | ||
| }) | ||
| } | ||
| } |
| --- | ||
| # https://vitepress.dev/reference/default-theme-home-page | ||
| layout: home | ||
| hero: | ||
| name: "Grip Layout Plus" | ||
| text: "A VitePress Site" | ||
| tagline: My great project tagline | ||
| name: Grid Layout Plus | ||
| text: A draggable and resizable grid layout for Vue 3 | ||
| tagline: A grid layout system for Vue 3. Heavily inspired by React Grid Layout. | ||
| actions: | ||
| - theme: brand | ||
| text: Markdown Examples | ||
| link: /markdown-examples | ||
| text: Get Started | ||
| link: /guide/installation | ||
| - theme: alt | ||
| text: API Examples | ||
| link: /api-examples | ||
| text: View on GitHub | ||
| link: https://github.com/qmhc/grid-layout-plus | ||
| features: | ||
| - title: Feature A | ||
| details: Lorem ipsum dolor sit amet, consectetur adipiscing elit | ||
| - title: Feature B | ||
| details: Lorem ipsum dolor sit amet, consectetur adipiscing elit | ||
| - title: Feature C | ||
| details: Lorem ipsum dolor sit amet, consectetur adipiscing elit | ||
| - title: ✥ Draggable widgets | ||
| details: | ||
| - title: ⇲ Resizable widgets | ||
| details: | ||
| - title: Static widgets | ||
| details: | ||
| - title: Bounds checking for dragging and resizing | ||
| details: | ||
| - title: Widgets can be added or removed without rebuilding grid | ||
| details: | ||
| - title: Layout can be serialized and restored | ||
| details: | ||
| - title: Automatic RTL support | ||
| details: | ||
| - title: Responsive | ||
| details: | ||
| - title: Min/max w/h per item | ||
| details: | ||
| --- | ||
| { | ||
| "name": "grip-layout-plus-docs", | ||
| "name": "grid-layout-plus-docs", | ||
| "scripts": { | ||
| "docs:dev": "vitepress dev", | ||
| "docs:build": "vitepress build", | ||
| "docs:preview": "vitepress preview" | ||
| "build": "vitepress build", | ||
| "preview": "vitepress preview", | ||
| "serve": "vitepress dev" | ||
| }, | ||
| "dependencies": { | ||
| "@vexip-ui/utils": "^1.10.2", | ||
| "grid-layout-plus": "workspace:*", | ||
@@ -16,2 +17,2 @@ "vexip-ui": "^2.1.12", | ||
| } | ||
| } | ||
| } |
@@ -1,2 +0,2 @@ | ||
| "use strict";const r=require("vue"),b=require("../helpers/common.js"),x=require("../helpers/draggable.js"),se=require("../helpers/responsive.js"),J=require("../helpers/dom.js"),Q=require("../node_modules/.pnpm/interactjs@1.10.17/node_modules/interactjs/dist/interact.min.js"),le=r.defineComponent({__name:"grid-item",props:{isDraggable:{type:Boolean,default:null},isResizable:{type:Boolean,default:null},isBounded:{type:Boolean,default:null},static:{type:Boolean,default:!1},minH:{type:Number,default:1},minW:{type:Number,default:1},maxH:{type:Number,default:1/0},maxW:{type:Number,default:1/0},x:{type:Number,required:!0},y:{type:Number,required:!0},w:{type:Number,required:!0},h:{type:Number,required:!0},i:{type:[Number,String],required:!0},dragIgnoreFrom:{type:String,default:"a, button"},dragAllowFrom:{type:String,default:null},resizeIgnoreFrom:{type:String,default:"a, button"},preserveAspectRatio:{type:Boolean,default:!1},dragOption:{type:Object,default:()=>({})},resizeOption:{type:Object,default:()=>({})}},emits:["container-resized","resize","resized","move","moved"],setup(Z,{expose:U,emit:z}){const n=Z,g=r.inject(b.LAYOUT_KEY),c=r.inject(b.EMITTER_KEY),u=r.ref(null),e=r.reactive({cols:1,containerWidth:100,rowHeight:30,margin:[10,10],maxRows:1/0,draggable:null,resizable:null,bounded:null,transformScale:1,useCssTransforms:!0,useStyleCursor:!0,isDragging:!1,dragging:{top:-1,left:-1},isResizing:!1,resizing:{width:-1,height:-1},lastX:NaN,lastY:NaN,lastW:NaN,lastH:NaN,style:{},rtl:!1,dragEventSet:!1,resizeEventSet:!1,previousW:-1,previousH:-1,previousX:-1,previousY:-1,innerX:n.x,innerY:n.y,innerW:n.w,innerH:n.h}),v=r.ref(),Y=r.reactive({i:r.toRef(n,"i"),state:e,wrapper:v,calcXY:C});function T(t){oe(t)}function k(){$()}function E(t){n.isDraggable===null&&(e.draggable=t)}function I(t){n.isResizable===null&&(e.resizable=t)}function q(t){n.isBounded===null&&(e.bounded=t)}function F(t){e.transformScale=t}function O(t){e.rowHeight=t}function P(t){e.maxRows=t}function A(){e.rtl=J.getDocumentDir()==="rtl",$()}function _(t){e.cols=Math.floor(t)}c.on("updateWidth",T),c.on("compact",k),c.on("setDraggable",E),c.on("setResizable",I),c.on("setBounded",q),c.on("setTransformScale",F),c.on("setRowHeight",O),c.on("setMaxRows",P),c.on("directionchange",A),c.on("setColNum",_),g.increaseItem(Y),r.onBeforeMount(()=>{e.rtl=J.getDocumentDir()==="rtl"}),r.onMounted(()=>{g.responsive&&g.lastBreakpoint?e.cols=se.getColsFromBreakpoint(g.lastBreakpoint,g.cols):e.cols=g.colNum,e.rowHeight=g.rowHeight,e.containerWidth=g.width!==null?g.width:100,e.margin=g.margin!==void 0?g.margin:[10,10],e.maxRows=g.maxRows,n.isDraggable===null?e.draggable=g.isDraggable:e.draggable=n.isDraggable,n.isResizable===null?e.resizable=g.isResizable:e.resizable=n.isResizable,n.isBounded===null?e.bounded=g.isBounded:e.bounded=n.isBounded,e.transformScale=g.transformScale,e.useCssTransforms=g.useCssTransforms,e.useStyleCursor=g.useStyleCursor,h()}),U({state:e,wrapper:v}),r.onBeforeUnmount(()=>{c.off("updateWidth",T),c.off("compact",k),c.off("setDraggable",E),c.off("setResizable",I),c.off("setBounded",q),c.off("setTransformScale",F),c.off("setRowHeight",O),c.off("setMaxRows",P),c.off("directionchange",A),c.off("setColNum",_),u.value&&(u.value.unset(),u.value=null),g.decreaseItem(Y)});const ee=navigator.userAgent.toLowerCase().includes("android"),L=r.computed(()=>e.resizable&&!n.static),f=r.computed(()=>g.isMirrored?!e.rtl:e.rtl),te=r.computed(()=>(e.draggable||e.resizable)&&!n.static),ne=r.computed(()=>({"vue-resizable":L.value,static:n.static,resizing:e.isResizing,"vue-draggable-dragging":e.isDragging,"css-transforms":e.useCssTransforms,"render-rtl":f.value,"disable-userselect":e.isDragging,"no-touch":ee&&te.value})),M=r.computed(()=>f.value?"vue-resizable-handle vue-rtl-resizable-handle":"vue-resizable-handle");r.watch(()=>n.isDraggable,t=>{e.draggable=t}),r.watch(()=>n.static,()=>{V(),p()}),r.watch(()=>e.draggable,()=>{V()}),r.watch(()=>n.isResizable,t=>{e.resizable=t}),r.watch(()=>n.isBounded,t=>{e.bounded=t}),r.watch(()=>e.resizable,()=>{p()}),r.watch(()=>e.rowHeight,()=>{h(),S()}),r.watch(()=>e.cols,()=>{p(),h(),S()}),r.watch(()=>e.containerWidth,()=>{p(),h(),S()}),r.watch(()=>n.x,t=>{e.innerX=t,h()}),r.watch(()=>n.y,t=>{e.innerY=t,h()}),r.watch(()=>n.h,t=>{e.innerH=t,h()}),r.watch(()=>n.w,t=>{e.innerW=t,h()}),r.watch(f,()=>{p(),h()}),r.watch(()=>n.minH,()=>{p()}),r.watch(()=>n.maxH,()=>{p()}),r.watch(()=>n.minW,()=>{p()}),r.watch(()=>n.maxW,()=>{p()}),r.watch(()=>g.margin,t=>{!t||t[0]===e.margin[0]&&t[1]===e.margin[1]||(e.margin=t.map(a=>Number(a)),h(),S())});function h(){n.x+n.w>e.cols?(e.innerX=0,e.innerW=n.w>e.cols?e.cols:n.w):(e.innerX=n.x,e.innerW=n.w);const t=y(e.innerX,e.innerY,e.innerW,e.innerH);e.isDragging&&(t.top=e.dragging.top,f.value?t.right=e.dragging.left:t.left=e.dragging.left),e.isResizing&&(t.width=e.resizing.width,t.height=e.resizing.height);let a;e.useCssTransforms?f.value?a=b.setTransformRtl(t.top,t.right,t.width,t.height):a=b.setTransform(t.top,t.left,t.width,t.height):f.value?a=b.setTopRight(t.top,t.right,t.width,t.height):a=b.setTopLeft(t.top,t.left,t.width,t.height),e.style=a}function S(){const t={};for(const a of["width","height"]){const l=e.style[a].match(/^(\d+)px$/);if(!l)return;t[a]=l[1]}z("container-resized",n.i,n.h,n.w,t.height,t.width)}function ie(t){if(n.static)return;const a=x.getControlPosition(t);if(a==null)return;const{x:s,y:l}=a,o={width:0,height:0};let i;switch(t.type){case"resizestart":{p(),e.previousW=e.innerW,e.previousH=e.innerH,i=y(e.innerX,e.innerY,e.innerW,e.innerH),o.width=i.width,o.height=i.height,e.resizing=o,e.isResizing=!0;break}case"resizemove":{const d=x.createCoreData(e.lastW,e.lastH,s,l);f.value?o.width=e.resizing.width-d.deltaX/e.transformScale:o.width=e.resizing.width+d.deltaX/e.transformScale,o.height=e.resizing.height+d.deltaY/e.transformScale,e.resizing=o;break}case"resizeend":{i=y(e.innerX,e.innerY,e.innerW,e.innerH),o.width=i.width,o.height=i.height,e.resizing={width:-1,height:-1},e.isResizing=!1;break}}i=ae(o.height,o.width),i.w<n.minW&&(i.w=n.minW),i.w>n.maxW&&(i.w=n.maxW),i.h<n.minH&&(i.h=n.minH),i.h>n.maxH&&(i.h=n.maxH),i.h<1&&(i.h=1),i.w<1&&(i.w=1),e.lastW=s,e.lastH=l,(e.innerW!==i.w||e.innerH!==i.h)&&z("resize",n.i,i.h,i.w,o.height,o.width),t.type==="resizeend"&&(e.previousW!==e.innerW||e.previousH!==e.innerH)&&z("resized",n.i,i.h,i.w,o.height,o.width),c.emit("resizeEvent",t.type,n.i,e.innerX,e.innerY,i.h,i.w)}function re(t){if(n.static||e.isResizing)return;const a=x.getControlPosition(t);if(a===null)return;const{x:s,y:l}=a,o=t.target;if(!o.offsetParent)return;const i={top:0,left:0};switch(t.type){case"dragstart":{e.previousX=e.innerX,e.previousY=e.innerY;const m=o.offsetParent.getBoundingClientRect(),w=o.getBoundingClientRect(),H=w.left/e.transformScale,R=m.left/e.transformScale,B=w.right/e.transformScale,D=m.right/e.transformScale,N=w.top/e.transformScale,X=m.top/e.transformScale;f.value?i.left=(B-D)*-1:i.left=H-R,i.top=N-X,e.dragging=i,e.isDragging=!0;break}case"dragend":{if(!e.isDragging)return;const m=o.offsetParent.getBoundingClientRect(),w=o.getBoundingClientRect(),H=w.left/e.transformScale,R=m.left/e.transformScale,B=w.right/e.transformScale,D=m.right/e.transformScale,N=w.top/e.transformScale,X=m.top/e.transformScale;f.value?i.left=(B-D)*-1:i.left=H-R,i.top=N-X,e.dragging={top:-1,left:-1},e.isDragging=!1;break}case"dragmove":{const m=x.createCoreData(e.lastX,e.lastY,s,l);if(f.value?i.left=e.dragging.left-m.deltaX/e.transformScale:i.left=e.dragging.left+m.deltaX/e.transformScale,i.top=e.dragging.top+m.deltaY/e.transformScale,e.bounded){const w=o.offsetParent.clientHeight-j(n.h,e.rowHeight,e.margin[1]);i.top=K(i.top,0,w);const H=W(),R=e.containerWidth-j(n.w,H,e.margin[0]);i.left=K(i.left,0,R)}e.dragging=i;break}}let d;f.value,d=C(i.top,i.left),e.lastX=s,e.lastY=l,(e.innerX!==d.x||e.innerY!==d.y)&&z("move",n.i,d.x,d.y),t.type==="dragend"&&(e.previousX!==e.innerX||e.previousY!==e.innerY)&&z("moved",n.i,d.x,d.y),c.emit("dragEvent",t.type,n.i,d.x,d.y,e.innerH,e.innerW)}function y(t,a,s,l){const o=W();let i;return f.value?i={right:Math.round(o*t+(t+1)*e.margin[0]),top:Math.round(e.rowHeight*a+(a+1)*e.margin[1]),width:s===1/0?s:Math.round(o*s+Math.max(0,s-1)*e.margin[0]),height:l===1/0?l:Math.round(e.rowHeight*l+Math.max(0,l-1)*e.margin[1])}:i={left:Math.round(o*t+(t+1)*e.margin[0]),top:Math.round(e.rowHeight*a+(a+1)*e.margin[1]),width:s===1/0?s:Math.round(o*s+Math.max(0,s-1)*e.margin[0]),height:l===1/0?l:Math.round(e.rowHeight*l+Math.max(0,l-1)*e.margin[1])},i}function C(t,a){const s=W();let l=Math.round((a-e.margin[0])/(s+e.margin[0])),o=Math.round((t-e.margin[1])/(e.rowHeight+e.margin[1]));return l=Math.max(Math.min(l,e.cols-e.innerW),0),o=Math.max(Math.min(o,e.maxRows-e.innerH),0),{x:l,y:o}}function W(){return(e.containerWidth-e.margin[0]*(e.cols+1))/e.cols}function j(t,a,s){return Number.isFinite(t)?Math.round(a*t+Math.max(0,t-1)*s):t}function K(t,a,s){return Math.max(Math.min(t,s),a)}function ae(t,a,s=!1){const l=W();let o=Math.round((a+e.margin[0])/(l+e.margin[0])),i=0;return s?i=Math.ceil((t+e.margin[1])/(e.rowHeight+e.margin[1])):i=Math.round((t+e.margin[1])/(e.rowHeight+e.margin[1])),o=Math.max(Math.min(o,e.cols-e.innerX),0),i=Math.max(Math.min(i,e.maxRows-e.innerY),0),{w:o,h:i}}function oe(t,a){e.containerWidth=t,a!=null&&(e.cols=a)}function $(){h()}function G(){!u.value&&v.value&&(u.value=Q(v.value),e.useStyleCursor||u.value.styleCursor(!1))}function V(){if(G(),!!u.value)if(e.draggable&&!n.static){const t={ignoreFrom:n.dragIgnoreFrom,allowFrom:n.dragAllowFrom,...n.dragOption};u.value.draggable(t),e.dragEventSet||(e.dragEventSet=!0,u.value.on("dragstart dragmove dragend",a=>{re(a)}))}else u.value.draggable({enabled:!1})}function p(){if(G(),!!u.value)if(e.resizable&&!n.static){const t=y(0,0,n.maxW,n.maxH),a=y(0,0,n.minW,n.minH),s={edges:{left:!1,right:"."+M.value.trim().replace(" ","."),bottom:"."+M.value.trim().replace(" ","."),top:!1},ignoreFrom:n.resizeIgnoreFrom,restrictSize:{min:{height:a.height*e.transformScale,width:a.width*e.transformScale},max:{height:t.height*e.transformScale,width:t.width*e.transformScale}},...n.resizeOption};n.preserveAspectRatio&&(s.modifiers=[Q.modifiers.aspectRatio({ratio:"preserve"})]),u.value.resizable(s),e.resizeEventSet||(e.resizeEventSet=!0,u.value.on("resizestart resizemove resizeend",l=>{ie(l)}))}else u.value.resizable({enabled:!1})}return(t,a)=>(r.openBlock(),r.createElementBlock("div",{ref_key:"wrapper",ref:v,class:r.normalizeClass(["vue-grid-item",r.unref(ne)]),style:r.normalizeStyle(e.style)},[r.renderSlot(t.$slots,"default"),r.unref(L)?(r.openBlock(),r.createElementBlock("span",{key:0,ref:"handle",class:r.normalizeClass(r.unref(M))},null,2)):r.createCommentVNode("",!0)],6))}});module.exports=le; | ||
| "use strict";const r=require("vue"),b=require("../helpers/common.js"),x=require("../helpers/draggable.js"),se=require("../helpers/responsive.js"),J=require("../helpers/dom.js"),Q=require("interactjs"),le=r.defineComponent({__name:"grid-item",props:{isDraggable:{type:Boolean,default:null},isResizable:{type:Boolean,default:null},isBounded:{type:Boolean,default:null},static:{type:Boolean,default:!1},minH:{type:Number,default:1},minW:{type:Number,default:1},maxH:{type:Number,default:1/0},maxW:{type:Number,default:1/0},x:{type:Number,required:!0},y:{type:Number,required:!0},w:{type:Number,required:!0},h:{type:Number,required:!0},i:{type:[Number,String],required:!0},dragIgnoreFrom:{type:String,default:"a, button"},dragAllowFrom:{type:String,default:null},resizeIgnoreFrom:{type:String,default:"a, button"},preserveAspectRatio:{type:Boolean,default:!1},dragOption:{type:Object,default:()=>({})},resizeOption:{type:Object,default:()=>({})}},emits:["container-resized","resize","resized","move","moved"],setup(Z,{expose:U,emit:z}){const n=Z,g=r.inject(b.LAYOUT_KEY),c=r.inject(b.EMITTER_KEY),u=r.ref(null),e=r.reactive({cols:1,containerWidth:100,rowHeight:30,margin:[10,10],maxRows:1/0,draggable:null,resizable:null,bounded:null,transformScale:1,useCssTransforms:!0,useStyleCursor:!0,isDragging:!1,dragging:{top:-1,left:-1},isResizing:!1,resizing:{width:-1,height:-1},lastX:NaN,lastY:NaN,lastW:NaN,lastH:NaN,style:{},rtl:!1,dragEventSet:!1,resizeEventSet:!1,previousW:-1,previousH:-1,previousX:-1,previousY:-1,innerX:n.x,innerY:n.y,innerW:n.w,innerH:n.h}),v=r.ref(),Y=r.reactive({i:r.toRef(n,"i"),state:e,wrapper:v,calcXY:C});function T(t){oe(t)}function k(){$()}function E(t){n.isDraggable===null&&(e.draggable=t)}function I(t){n.isResizable===null&&(e.resizable=t)}function q(t){n.isBounded===null&&(e.bounded=t)}function F(t){e.transformScale=t}function O(t){e.rowHeight=t}function P(t){e.maxRows=t}function A(){e.rtl=J.getDocumentDir()==="rtl",$()}function _(t){e.cols=Math.floor(t)}c.on("updateWidth",T),c.on("compact",k),c.on("setDraggable",E),c.on("setResizable",I),c.on("setBounded",q),c.on("setTransformScale",F),c.on("setRowHeight",O),c.on("setMaxRows",P),c.on("directionchange",A),c.on("setColNum",_),g.increaseItem(Y),r.onBeforeMount(()=>{e.rtl=J.getDocumentDir()==="rtl"}),r.onMounted(()=>{g.responsive&&g.lastBreakpoint?e.cols=se.getColsFromBreakpoint(g.lastBreakpoint,g.cols):e.cols=g.colNum,e.rowHeight=g.rowHeight,e.containerWidth=g.width!==null?g.width:100,e.margin=g.margin!==void 0?g.margin:[10,10],e.maxRows=g.maxRows,n.isDraggable===null?e.draggable=g.isDraggable:e.draggable=n.isDraggable,n.isResizable===null?e.resizable=g.isResizable:e.resizable=n.isResizable,n.isBounded===null?e.bounded=g.isBounded:e.bounded=n.isBounded,e.transformScale=g.transformScale,e.useCssTransforms=g.useCssTransforms,e.useStyleCursor=g.useStyleCursor,h()}),U({state:e,wrapper:v}),r.onBeforeUnmount(()=>{c.off("updateWidth",T),c.off("compact",k),c.off("setDraggable",E),c.off("setResizable",I),c.off("setBounded",q),c.off("setTransformScale",F),c.off("setRowHeight",O),c.off("setMaxRows",P),c.off("directionchange",A),c.off("setColNum",_),u.value&&(u.value.unset(),u.value=null),g.decreaseItem(Y)});const ee=navigator.userAgent.toLowerCase().includes("android"),L=r.computed(()=>e.resizable&&!n.static),f=r.computed(()=>g.isMirrored?!e.rtl:e.rtl),te=r.computed(()=>(e.draggable||e.resizable)&&!n.static),ne=r.computed(()=>({"vue-resizable":L.value,static:n.static,resizing:e.isResizing,"vue-draggable-dragging":e.isDragging,"css-transforms":e.useCssTransforms,"render-rtl":f.value,"disable-userselect":e.isDragging,"no-touch":ee&&te.value})),M=r.computed(()=>f.value?"vue-resizable-handle vue-rtl-resizable-handle":"vue-resizable-handle");r.watch(()=>n.isDraggable,t=>{e.draggable=t}),r.watch(()=>n.static,()=>{V(),p()}),r.watch(()=>e.draggable,()=>{V()}),r.watch(()=>n.isResizable,t=>{e.resizable=t}),r.watch(()=>n.isBounded,t=>{e.bounded=t}),r.watch(()=>e.resizable,()=>{p()}),r.watch(()=>e.rowHeight,()=>{h(),S()}),r.watch(()=>e.cols,()=>{p(),h(),S()}),r.watch(()=>e.containerWidth,()=>{p(),h(),S()}),r.watch(()=>n.x,t=>{e.innerX=t,h()}),r.watch(()=>n.y,t=>{e.innerY=t,h()}),r.watch(()=>n.h,t=>{e.innerH=t,h()}),r.watch(()=>n.w,t=>{e.innerW=t,h()}),r.watch(f,()=>{p(),h()}),r.watch(()=>n.minH,()=>{p()}),r.watch(()=>n.maxH,()=>{p()}),r.watch(()=>n.minW,()=>{p()}),r.watch(()=>n.maxW,()=>{p()}),r.watch(()=>g.margin,t=>{!t||t[0]===e.margin[0]&&t[1]===e.margin[1]||(e.margin=t.map(a=>Number(a)),h(),S())});function h(){n.x+n.w>e.cols?(e.innerX=0,e.innerW=n.w>e.cols?e.cols:n.w):(e.innerX=n.x,e.innerW=n.w);const t=y(e.innerX,e.innerY,e.innerW,e.innerH);e.isDragging&&(t.top=e.dragging.top,f.value?t.right=e.dragging.left:t.left=e.dragging.left),e.isResizing&&(t.width=e.resizing.width,t.height=e.resizing.height);let a;e.useCssTransforms?f.value?a=b.setTransformRtl(t.top,t.right,t.width,t.height):a=b.setTransform(t.top,t.left,t.width,t.height):f.value?a=b.setTopRight(t.top,t.right,t.width,t.height):a=b.setTopLeft(t.top,t.left,t.width,t.height),e.style=a}function S(){const t={};for(const a of["width","height"]){const l=e.style[a].match(/^(\d+)px$/);if(!l)return;t[a]=l[1]}z("container-resized",n.i,n.h,n.w,t.height,t.width)}function ie(t){if(n.static)return;const a=x.getControlPosition(t);if(a==null)return;const{x:s,y:l}=a,o={width:0,height:0};let i;switch(t.type){case"resizestart":{p(),e.previousW=e.innerW,e.previousH=e.innerH,i=y(e.innerX,e.innerY,e.innerW,e.innerH),o.width=i.width,o.height=i.height,e.resizing=o,e.isResizing=!0;break}case"resizemove":{const d=x.createCoreData(e.lastW,e.lastH,s,l);f.value?o.width=e.resizing.width-d.deltaX/e.transformScale:o.width=e.resizing.width+d.deltaX/e.transformScale,o.height=e.resizing.height+d.deltaY/e.transformScale,e.resizing=o;break}case"resizeend":{i=y(e.innerX,e.innerY,e.innerW,e.innerH),o.width=i.width,o.height=i.height,e.resizing={width:-1,height:-1},e.isResizing=!1;break}}i=ae(o.height,o.width),i.w<n.minW&&(i.w=n.minW),i.w>n.maxW&&(i.w=n.maxW),i.h<n.minH&&(i.h=n.minH),i.h>n.maxH&&(i.h=n.maxH),i.h<1&&(i.h=1),i.w<1&&(i.w=1),e.lastW=s,e.lastH=l,(e.innerW!==i.w||e.innerH!==i.h)&&z("resize",n.i,i.h,i.w,o.height,o.width),t.type==="resizeend"&&(e.previousW!==e.innerW||e.previousH!==e.innerH)&&z("resized",n.i,i.h,i.w,o.height,o.width),c.emit("resizeEvent",t.type,n.i,e.innerX,e.innerY,i.h,i.w)}function re(t){if(n.static||e.isResizing)return;const a=x.getControlPosition(t);if(a===null)return;const{x:s,y:l}=a,o=t.target;if(!o.offsetParent)return;const i={top:0,left:0};switch(t.type){case"dragstart":{e.previousX=e.innerX,e.previousY=e.innerY;const m=o.offsetParent.getBoundingClientRect(),w=o.getBoundingClientRect(),H=w.left/e.transformScale,R=m.left/e.transformScale,B=w.right/e.transformScale,D=m.right/e.transformScale,N=w.top/e.transformScale,X=m.top/e.transformScale;f.value?i.left=(B-D)*-1:i.left=H-R,i.top=N-X,e.dragging=i,e.isDragging=!0;break}case"dragend":{if(!e.isDragging)return;const m=o.offsetParent.getBoundingClientRect(),w=o.getBoundingClientRect(),H=w.left/e.transformScale,R=m.left/e.transformScale,B=w.right/e.transformScale,D=m.right/e.transformScale,N=w.top/e.transformScale,X=m.top/e.transformScale;f.value?i.left=(B-D)*-1:i.left=H-R,i.top=N-X,e.dragging={top:-1,left:-1},e.isDragging=!1;break}case"dragmove":{const m=x.createCoreData(e.lastX,e.lastY,s,l);if(f.value?i.left=e.dragging.left-m.deltaX/e.transformScale:i.left=e.dragging.left+m.deltaX/e.transformScale,i.top=e.dragging.top+m.deltaY/e.transformScale,e.bounded){const w=o.offsetParent.clientHeight-j(n.h,e.rowHeight,e.margin[1]);i.top=K(i.top,0,w);const H=W(),R=e.containerWidth-j(n.w,H,e.margin[0]);i.left=K(i.left,0,R)}e.dragging=i;break}}let d;f.value,d=C(i.top,i.left),e.lastX=s,e.lastY=l,(e.innerX!==d.x||e.innerY!==d.y)&&z("move",n.i,d.x,d.y),t.type==="dragend"&&(e.previousX!==e.innerX||e.previousY!==e.innerY)&&z("moved",n.i,d.x,d.y),c.emit("dragEvent",t.type,n.i,d.x,d.y,e.innerH,e.innerW)}function y(t,a,s,l){const o=W();let i;return f.value?i={right:Math.round(o*t+(t+1)*e.margin[0]),top:Math.round(e.rowHeight*a+(a+1)*e.margin[1]),width:s===1/0?s:Math.round(o*s+Math.max(0,s-1)*e.margin[0]),height:l===1/0?l:Math.round(e.rowHeight*l+Math.max(0,l-1)*e.margin[1])}:i={left:Math.round(o*t+(t+1)*e.margin[0]),top:Math.round(e.rowHeight*a+(a+1)*e.margin[1]),width:s===1/0?s:Math.round(o*s+Math.max(0,s-1)*e.margin[0]),height:l===1/0?l:Math.round(e.rowHeight*l+Math.max(0,l-1)*e.margin[1])},i}function C(t,a){const s=W();let l=Math.round((a-e.margin[0])/(s+e.margin[0])),o=Math.round((t-e.margin[1])/(e.rowHeight+e.margin[1]));return l=Math.max(Math.min(l,e.cols-e.innerW),0),o=Math.max(Math.min(o,e.maxRows-e.innerH),0),{x:l,y:o}}function W(){return(e.containerWidth-e.margin[0]*(e.cols+1))/e.cols}function j(t,a,s){return Number.isFinite(t)?Math.round(a*t+Math.max(0,t-1)*s):t}function K(t,a,s){return Math.max(Math.min(t,s),a)}function ae(t,a,s=!1){const l=W();let o=Math.round((a+e.margin[0])/(l+e.margin[0])),i=0;return s?i=Math.ceil((t+e.margin[1])/(e.rowHeight+e.margin[1])):i=Math.round((t+e.margin[1])/(e.rowHeight+e.margin[1])),o=Math.max(Math.min(o,e.cols-e.innerX),0),i=Math.max(Math.min(i,e.maxRows-e.innerY),0),{w:o,h:i}}function oe(t,a){e.containerWidth=t,a!=null&&(e.cols=a)}function $(){h()}function G(){!u.value&&v.value&&(u.value=Q(v.value),e.useStyleCursor||u.value.styleCursor(!1))}function V(){if(G(),!!u.value)if(e.draggable&&!n.static){const t={ignoreFrom:n.dragIgnoreFrom,allowFrom:n.dragAllowFrom,...n.dragOption};u.value.draggable(t),e.dragEventSet||(e.dragEventSet=!0,u.value.on("dragstart dragmove dragend",a=>{re(a)}))}else u.value.draggable({enabled:!1})}function p(){if(G(),!!u.value)if(e.resizable&&!n.static){const t=y(0,0,n.maxW,n.maxH),a=y(0,0,n.minW,n.minH),s={edges:{left:!1,right:"."+M.value.trim().replace(" ","."),bottom:"."+M.value.trim().replace(" ","."),top:!1},ignoreFrom:n.resizeIgnoreFrom,restrictSize:{min:{height:a.height*e.transformScale,width:a.width*e.transformScale},max:{height:t.height*e.transformScale,width:t.width*e.transformScale}},...n.resizeOption};n.preserveAspectRatio&&(s.modifiers=[Q.modifiers.aspectRatio({ratio:"preserve"})]),u.value.resizable(s),e.resizeEventSet||(e.resizeEventSet=!0,u.value.on("resizestart resizemove resizeend",l=>{ie(l)}))}else u.value.resizable({enabled:!1})}return(t,a)=>(r.openBlock(),r.createElementBlock("div",{ref_key:"wrapper",ref:v,class:r.normalizeClass(["vue-grid-item",r.unref(ne)]),style:r.normalizeStyle(e.style)},[r.renderSlot(t.$slots,"default"),r.unref(L)?(r.openBlock(),r.createElementBlock("span",{key:0,ref:"handle",class:r.normalizeClass(r.unref(M))},null,2)):r.createCommentVNode("",!0)],6))}});module.exports=le; | ||
| //# sourceMappingURL=grid-item.vue.js.map |
@@ -1,2 +0,2 @@ | ||
| "use strict";const a=require("vue"),z=require("./grid-item.vue.js"),Y=require("../node_modules/.pnpm/@vexip-ui_hooks@1.8.2_vue@3.2.47/node_modules/@vexip-ui/hooks/dist/index.js"),E=require("../node_modules/.pnpm/@vexip-ui_utils@1.10.2/node_modules/@vexip-ui/utils/dist/index.js"),s=require("../helpers/common.js"),k=require("../helpers/responsive.js"),$=a.defineComponent({__name:"grid-layout",props:{autoSize:{type:Boolean,default:!0},colNum:{type:Number,default:12},rowHeight:{type:Number,default:150},maxRows:{type:Number,default:1/0},margin:{type:Array,default:()=>[10,10]},isDraggable:{type:Boolean,default:!0},isResizable:{type:Boolean,default:!0},isMirrored:{type:Boolean,default:!1},isBounded:{type:Boolean,default:!1},useCssTransforms:{type:Boolean,default:!0},verticalCompact:{type:Boolean,default:!0},restoreOnDrag:{type:Boolean,default:!1},layout:{type:Array,required:!0},responsive:{type:Boolean,default:!1},responsiveLayouts:{type:Object,default:()=>({})},transformScale:{type:Number,default:1},breakpoints:{type:Object,default:()=>({lg:1200,md:996,sm:768,xs:480,xxs:0})},cols:{type:Object,default:()=>({lg:12,md:10,sm:6,xs:4,xxs:2})},preventCollision:{type:Boolean,default:!1},useStyleCursor:{type:Boolean,default:!0}},emits:["layout-updated","breakpoint-changed","update:layout","layout-ready"],setup(D,{expose:T,emit:f}){const o=D,t=a.reactive({width:-1,mergedStyle:{},lastLayoutLength:0,isDragging:!1,placeholder:{x:0,y:0,w:0,h:0,i:""},layouts:{},lastBreakpoint:null,originalLayout:null}),B=new Map,i=a.ref(o.layout),g=a.ref(),{observeResize:_,unobserveResize:S}=Y.useResize(),r=E.createEventEmitter();r.on("resizeEvent",H),r.on("dragEvent",q),a.onMounted(()=>{a.nextTick(()=>{s.validateLayout(i.value),t.originalLayout=i.value,a.nextTick(()=>{R(),g.value&&_(g.value,L),s.compact(i.value,o.verticalCompact),f("layout-updated",i.value),h(),L()})})}),a.onBeforeUnmount(()=>{r.clearAll(),g.value&&S(g.value)});function H(e,n,u,p,c,d){W(e,n,u,p,c,d)}function q(e,n,u,p,c,d){C(e,n,u,p,c,d)}a.watch(()=>t.width,(e,n)=>{a.nextTick(()=>{r.emit("updateWidth",e),n===null&&a.nextTick(()=>{f("layout-ready",i.value)}),h()})}),a.watch(()=>[o.layout,o.layout.length],()=>{i.value=o.layout,F()}),a.watch(()=>o.colNum,e=>{r.emit("setColNum",e)}),a.watch(()=>o.rowHeight,e=>{r.emit("setRowHeight",e)}),a.watch(()=>o.isDraggable,e=>{r.emit("setDraggable",e)}),a.watch(()=>o.isResizable,e=>{r.emit("setResizable",e)}),a.watch(()=>o.isBounded,e=>{r.emit("setBounded",e)}),a.watch(()=>o.transformScale,e=>{r.emit("setTransformScale",e)}),a.watch(()=>o.responsive,e=>{e||(f("update:layout",t.originalLayout),r.emit("setColNum",o.colNum)),L()}),a.watch(()=>o.maxRows,e=>{r.emit("setMaxRows",e)}),a.watch(()=>o.margin,h),a.provide(s.LAYOUT_KEY,a.reactive({...a.toRefs(o),...a.toRefs(t),increaseItem:N,decreaseItem:O})),a.provide(s.EMITTER_KEY,r),T({state:t,getItem:I,dragEvent:C});function N(e){B.set(e.i,e)}function O(e){B.delete(e.i)}function I(e){return B.get(e)}function F(){if(i.value!==void 0&&t.originalLayout!==null){if(i.value.length!==t.originalLayout.length){const e=j(i.value,t.originalLayout);e.length>0&&(i.value.length>t.originalLayout.length?t.originalLayout=t.originalLayout.concat(e):t.originalLayout=t.originalLayout.filter(n=>!e.some(u=>n.i===u.i))),t.lastLayoutLength=i.value.length,R()}s.compact(i.value,o.verticalCompact),r.emit("updateWidth",t.width),h(),f("layout-updated",i.value)}}function h(){t.mergedStyle={height:M()}}function L(){g.value&&(t.width=g.value.offsetWidth),r.emit("resizeEvent")}function M(){return o.autoSize?s.bottom(i.value)*(o.rowHeight+o.margin[1])+o.margin[1]+"px":void 0}let b;function C(e,n,u,p,c,d){let l=s.getLayoutItem(i.value,n);l==null&&(l={h:0,w:0,x:0,y:0,i:""}),e==="dragstart"&&!o.verticalCompact&&(b=i.value.reduce((v,{i:w,x:y,y:m})=>({...v,[w]:{x:y,y:m}}),{})),e==="dragmove"||e==="dragstart"?(t.placeholder.i=n,t.placeholder.x=l.x,t.placeholder.y=l.y,t.placeholder.w=d,t.placeholder.h=c,a.nextTick(()=>{t.isDragging=!0}),r.emit("updateWidth",t.width)):a.nextTick(()=>{t.isDragging=!1}),i.value=s.moveElement(i.value,l,u,p,!0,o.preventCollision),o.restoreOnDrag?(l.static=!0,s.compact(i.value,o.verticalCompact,b),l.static=!1):s.compact(i.value,o.verticalCompact),r.emit("compact"),h(),e==="dragend"&&(b=void 0,f("layout-updated",i.value))}function W(e,n,u,p,c,d){let l=s.getLayoutItem(i.value,n);E.isNull(l)&&(l={h:0,w:0,x:0,y:0,i:""});let v;if(o.preventCollision){const w=s.getAllCollisions(i.value,{...l,w:d,h:c}).filter(y=>y.i!==l.i);if(v=w.length>0,v){let y=1/0,m=1/0;w.forEach(x=>{x.x>l.x&&(y=Math.min(y,x.x)),x.y>l.y&&(m=Math.min(m,x.y))}),Number.isFinite(y)&&(l.w=y-l.x),Number.isFinite(m)&&(l.h=m-l.y)}}v||(l.w=d,l.h=c),e==="resizestart"||e==="resizemove"?(t.placeholder.i=n,t.placeholder.x=u,t.placeholder.y=p,t.placeholder.w=l.w,t.placeholder.h=l.h,a.nextTick(()=>{t.isDragging=!0}),r.emit("updateWidth",t.width)):a.nextTick(()=>{t.isDragging=!1}),o.responsive&&A(),s.compact(i.value,o.verticalCompact),r.emit("compact"),h(),e==="resizeend"&&f("layout-updated",i.value)}function A(){const e=k.getBreakpointFromWidth(o.breakpoints,t.width),n=k.getColsFromBreakpoint(e,o.cols);t.lastBreakpoint!=null&&!t.layouts[t.lastBreakpoint]&&(t.layouts[t.lastBreakpoint]=s.cloneLayout(i.value));const u=k.findOrGenerateResponsiveLayout(t.originalLayout,t.layouts,o.breakpoints,e,t.lastBreakpoint,n,o.verticalCompact);t.layouts[e]=u,t.lastBreakpoint!==e&&f("breakpoint-changed",e,u),f("update:layout",u),t.lastBreakpoint=e,r.emit("setColNum",k.getColsFromBreakpoint(e,o.cols))}function R(){t.layouts=Object.assign({},o.responsiveLayouts)}function j(e,n){const u=e.filter(c=>!n.some(d=>c.i===d.i)),p=n.filter(c=>!e.some(d=>c.i===d.i));return u.concat(p)}return(e,n)=>(a.openBlock(),a.createElementBlock("div",{ref_key:"wrapper",ref:g,class:"vue-grid-layout",style:a.normalizeStyle(t.mergedStyle)},[e.$slots.default?a.renderSlot(e.$slots,"default",{key:0}):(a.openBlock(!0),a.createElementBlock(a.Fragment,{key:1},a.renderList(i.value,u=>(a.openBlock(),a.createBlock(z,a.mergeProps({key:u.i},u),{default:a.withCtx(()=>[a.renderSlot(e.$slots,"item",{item:u})]),_:2},1040))),128)),a.withDirectives(a.createVNode(z,{class:"vue-grid-placeholder",x:t.placeholder.x,y:t.placeholder.y,w:t.placeholder.w,h:t.placeholder.h,i:t.placeholder.i},null,8,["x","y","w","h","i"]),[[a.vShow,t.isDragging]])],4))}});module.exports=$; | ||
| "use strict";const a=require("vue"),z=require("./grid-item.vue.js"),Y=require("@vexip-ui/hooks"),E=require("@vexip-ui/utils"),s=require("../helpers/common.js"),B=require("../helpers/responsive.js"),U=a.defineComponent({__name:"grid-layout",props:{autoSize:{type:Boolean,default:!0},colNum:{type:Number,default:12},rowHeight:{type:Number,default:150},maxRows:{type:Number,default:1/0},margin:{type:Array,default:()=>[10,10]},isDraggable:{type:Boolean,default:!0},isResizable:{type:Boolean,default:!0},isMirrored:{type:Boolean,default:!1},isBounded:{type:Boolean,default:!1},useCssTransforms:{type:Boolean,default:!0},verticalCompact:{type:Boolean,default:!0},restoreOnDrag:{type:Boolean,default:!1},layout:{type:Array,required:!0},responsive:{type:Boolean,default:!1},responsiveLayouts:{type:Object,default:()=>({})},transformScale:{type:Number,default:1},breakpoints:{type:Object,default:()=>({lg:1200,md:996,sm:768,xs:480,xxs:0})},cols:{type:Object,default:()=>({lg:12,md:10,sm:6,xs:4,xxs:2})},preventCollision:{type:Boolean,default:!1},useStyleCursor:{type:Boolean,default:!0}},emits:["layout-before-mount","layout-mounted","layout-updated","breakpoint-changed","update:layout","layout-ready"],setup(D,{expose:T,emit:p}){const o=D,t=a.reactive({width:-1,mergedStyle:{},lastLayoutLength:0,isDragging:!1,placeholder:{x:0,y:0,w:0,h:0,i:""},layouts:{},lastBreakpoint:null,originalLayout:null}),x=new Map,l=a.ref(o.layout),g=a.ref(),{observeResize:_,unobserveResize:S}=Y.useResize(),r=E.createEventEmitter();r.on("resizeEvent",H),r.on("dragEvent",q),a.onBeforeMount(()=>{p("layout-before-mount",l.value)}),a.onMounted(()=>{p("layout-mounted",l.value),a.nextTick(()=>{s.validateLayout(l.value),t.originalLayout=l.value,a.nextTick(()=>{R(),g.value&&_(g.value,b),s.compact(l.value,o.verticalCompact),p("layout-updated",l.value),h(),b()})})}),a.onBeforeUnmount(()=>{r.clearAll(),g.value&&S(g.value)});function H(e,n,u,f,c,d){W(e,n,u,f,c,d)}function q(e,n,u,f,c,d){C(e,n,u,f,c,d)}a.watch(()=>t.width,(e,n)=>{a.nextTick(()=>{r.emit("updateWidth",e),n===null&&a.nextTick(()=>{p("layout-ready",l.value)}),h()})}),a.watch(()=>[o.layout,o.layout.length],()=>{l.value=o.layout,M()}),a.watch(()=>o.colNum,e=>{r.emit("setColNum",e)}),a.watch(()=>o.rowHeight,e=>{r.emit("setRowHeight",e)}),a.watch(()=>o.isDraggable,e=>{r.emit("setDraggable",e)}),a.watch(()=>o.isResizable,e=>{r.emit("setResizable",e)}),a.watch(()=>o.isBounded,e=>{r.emit("setBounded",e)}),a.watch(()=>o.transformScale,e=>{r.emit("setTransformScale",e)}),a.watch(()=>o.responsive,e=>{e||(p("update:layout",t.originalLayout),r.emit("setColNum",o.colNum)),b()}),a.watch(()=>o.maxRows,e=>{r.emit("setMaxRows",e)}),a.watch(()=>o.margin,h),a.provide(s.LAYOUT_KEY,a.reactive({...a.toRefs(o),...a.toRefs(t),increaseItem:N,decreaseItem:O})),a.provide(s.EMITTER_KEY,r),T({state:t,getItem:I,dragEvent:C});function N(e){x.set(e.i,e)}function O(e){x.delete(e.i)}function I(e){return x.get(e)}function M(){if(l.value!==void 0&&t.originalLayout!==null){if(l.value.length!==t.originalLayout.length){const e=j(l.value,t.originalLayout);e.length>0&&(l.value.length>t.originalLayout.length?t.originalLayout=t.originalLayout.concat(e):t.originalLayout=t.originalLayout.filter(n=>!e.some(u=>n.i===u.i))),t.lastLayoutLength=l.value.length,R()}s.compact(l.value,o.verticalCompact),r.emit("updateWidth",t.width),h(),p("layout-updated",l.value)}}function h(){t.mergedStyle={height:F()}}function b(){g.value&&(t.width=g.value.offsetWidth),r.emit("resizeEvent")}function F(){return o.autoSize?s.bottom(l.value)*(o.rowHeight+o.margin[1])+o.margin[1]+"px":void 0}let L;function C(e,n,u,f,c,d){let i=s.getLayoutItem(l.value,n);i==null&&(i={h:0,w:0,x:0,y:0,i:""}),e==="dragstart"&&!o.verticalCompact&&(L=l.value.reduce((v,{i:w,x:y,y:m})=>({...v,[w]:{x:y,y:m}}),{})),e==="dragmove"||e==="dragstart"?(t.placeholder.i=n,t.placeholder.x=i.x,t.placeholder.y=i.y,t.placeholder.w=d,t.placeholder.h=c,a.nextTick(()=>{t.isDragging=!0}),r.emit("updateWidth",t.width)):a.nextTick(()=>{t.isDragging=!1}),l.value=s.moveElement(l.value,i,u,f,!0,o.preventCollision),o.restoreOnDrag?(i.static=!0,s.compact(l.value,o.verticalCompact,L),i.static=!1):s.compact(l.value,o.verticalCompact),r.emit("compact"),h(),e==="dragend"&&(L=void 0,p("layout-updated",l.value))}function W(e,n,u,f,c,d){let i=s.getLayoutItem(l.value,n);E.isNull(i)&&(i={h:0,w:0,x:0,y:0,i:""});let v;if(o.preventCollision){const w=s.getAllCollisions(l.value,{...i,w:d,h:c}).filter(y=>y.i!==i.i);if(v=w.length>0,v){let y=1/0,m=1/0;w.forEach(k=>{k.x>i.x&&(y=Math.min(y,k.x)),k.y>i.y&&(m=Math.min(m,k.y))}),Number.isFinite(y)&&(i.w=y-i.x),Number.isFinite(m)&&(i.h=m-i.y)}}v||(i.w=d,i.h=c),e==="resizestart"||e==="resizemove"?(t.placeholder.i=n,t.placeholder.x=u,t.placeholder.y=f,t.placeholder.w=i.w,t.placeholder.h=i.h,a.nextTick(()=>{t.isDragging=!0}),r.emit("updateWidth",t.width)):a.nextTick(()=>{t.isDragging=!1}),o.responsive&&A(),s.compact(l.value,o.verticalCompact),r.emit("compact"),h(),e==="resizeend"&&p("layout-updated",l.value)}function A(){const e=B.getBreakpointFromWidth(o.breakpoints,t.width),n=B.getColsFromBreakpoint(e,o.cols);t.lastBreakpoint!=null&&!t.layouts[t.lastBreakpoint]&&(t.layouts[t.lastBreakpoint]=s.cloneLayout(l.value));const u=B.findOrGenerateResponsiveLayout(t.originalLayout,t.layouts,o.breakpoints,e,t.lastBreakpoint,n,o.verticalCompact);t.layouts[e]=u,t.lastBreakpoint!==e&&p("breakpoint-changed",e,u),p("update:layout",u),t.lastBreakpoint=e,r.emit("setColNum",B.getColsFromBreakpoint(e,o.cols))}function R(){t.layouts=Object.assign({},o.responsiveLayouts)}function j(e,n){const u=e.filter(c=>!n.some(d=>c.i===d.i)),f=n.filter(c=>!e.some(d=>c.i===d.i));return u.concat(f)}return(e,n)=>(a.openBlock(),a.createElementBlock("div",{ref_key:"wrapper",ref:g,class:"vue-grid-layout",style:a.normalizeStyle(t.mergedStyle)},[e.$slots.default?a.renderSlot(e.$slots,"default",{key:0}):(a.openBlock(!0),a.createElementBlock(a.Fragment,{key:1},a.renderList(l.value,u=>(a.openBlock(),a.createBlock(z,a.mergeProps({key:u.i},u),{default:a.withCtx(()=>[a.renderSlot(e.$slots,"item",{item:u})]),_:2},1040))),128)),a.withDirectives(a.createVNode(z,{class:"vue-grid-placeholder",x:t.placeholder.x,y:t.placeholder.y,w:t.placeholder.w,h:t.placeholder.h,i:t.placeholder.i},null,8,["x","y","w","h","i"]),[[a.vShow,t.isDragging]])],4))}});module.exports=U; | ||
| //# sourceMappingURL=grid-layout.vue.js.map |
@@ -1,2 +0,2 @@ | ||
| "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=Symbol("LAYOUT_KEY"),v=Symbol("EMITTER_KEY");function A(e){let t=0,r;for(let n=0,o=e.length;n<o;n++)r=e[n].y+e[n].h,r>t&&(t=r);return t}function I(e){const t=Array(e.length);for(let r=0,n=e.length;r<n;r++)t[r]=x(e[r]);return t}function x(e){return JSON.parse(JSON.stringify(e))}function d(e,t){return!(e===t||e.x+e.w<=t.x||e.x>=t.x+t.w||e.y+e.h<=t.y||e.y>=t.y+t.h)}function Y(e,t,r){const n=g(e),o=w(e),i=Array(e.length);for(let s=0,u=o.length;s<u;s++){let f=o[s];f.static||(f=b(n,f,t,r),n.push(f)),i[e.indexOf(f)]=f,f.moved=!1}return i}function b(e,t,r,n){if(r)for(;t.y>0&&!l(e,t);)t.y--;else if(n){const i=n[t.i].y;for(;t.y>i&&!l(e,t);)t.y--}let o;for(;o=l(e,t);)t.y=o.y+o.h;return t}function C(e,t){const r=g(e);for(let n=0,o=e.length;n<o;n++){const i=e[n];if(i.x+i.w>t.cols&&(i.x=t.cols-i.w),i.x<0&&(i.x=0,i.w=t.cols),!i.static)r.push(i);else for(;l(r,i);)i.y++}return e}function O(e,t){for(let r=0,n=e.length;r<n;r++)if(e[r].i===t)return e[r]}function l(e,t){for(let r=0,n=e.length;r<n;r++)if(d(e[r],t))return e[r]}function E(e,t){return e.filter(r=>d(r,t))}function g(e){return e.filter(t=>t.static)}function p(e,t,r,n,o=!1,i=!1){if(t.static)return e;const s=t.x,u=t.y,f=n&&t.y>n;typeof r=="number"&&(t.x=r),typeof n=="number"&&(t.y=n),t.moved=!0;let a=w(e);f&&(a=a.reverse());const h=E(a,t);if(i&&h.length)return t.x=s,t.y=u,t.moved=!1,e;for(let m=0,L=h.length;m<L;m++){const c=h[m];c.moved||t.y>c.y&&t.y-c.y>c.h/4||(c.static?e=y(e,c,t,o):e=y(e,t,c,o))}return e}function y(e,t,r,n){if(n){const i={x:r.x,y:r.y,w:r.w,h:r.h,i:"-1"};if(i.y=Math.max(t.y-r.h,0),!l(e,i))return p(e,r,void 0,i.y,!1)}return p(e,r,void 0,r.y+1,!1)}function R(e,t,r,n){const o="translate3d("+t+"px,"+e+"px, 0)";return{transform:o,WebkitTransform:o,MozTransform:o,msTransform:o,OTransform:o,width:r+"px",height:n+"px",position:"absolute"}}function S(e,t,r,n){const o="translate3d("+t*-1+"px,"+e+"px, 0)";return{transform:o,WebkitTransform:o,MozTransform:o,msTransform:o,OTransform:o,width:r+"px",height:n+"px",position:"absolute"}}function K(e,t,r,n){return{top:e+"px",left:t+"px",width:r+"px",height:n+"px",position:"absolute"}}function _(e,t,r,n){return{top:e+"px",right:t+"px",width:r+"px",height:n+"px",position:"absolute"}}function w(e){return Array.from(e).sort(function(t,r){return t.y===r.y&&t.x===r.x?0:t.y>r.y||t.y===r.y&&t.x>r.x?1:-1})}function G(e,t){t=t||"Layout";const r=["x","y","w","h"],n=[];if(!Array.isArray(e))throw new Error(t+" must be an array!");for(let o=0,i=e.length;o<i;o++){const s=e[o];for(let u=0;u<r.length;u++)if(typeof s[r[u]]!="number")throw new Error("VueGridLayout: "+t+"["+o+"]."+r[u]+" must be a number!");if(s.i===void 0||s.i===null)throw new Error("VueGridLayout: "+t+"["+o+"].i cannot be null!");if(typeof s.i!="number"&&typeof s.i!="string")throw new Error("VueGridLayout: "+t+"["+o+"].i must be a string or number!");if(n.indexOf(s.i)>=0)throw new Error("VueGridLayout: "+t+"["+o+"].i must be unique!");if(n.push(s.i),s.static!==void 0&&typeof s.static!="boolean")throw new Error("VueGridLayout: "+t+"["+o+"].static must be a boolean!")}}exports.EMITTER_KEY=v;exports.LAYOUT_KEY=T;exports.bottom=A;exports.cloneLayout=I;exports.cloneLayoutItem=x;exports.collides=d;exports.compact=Y;exports.compactItem=b;exports.correctBounds=C;exports.getAllCollisions=E;exports.getFirstCollision=l;exports.getLayoutItem=O;exports.getStatics=g;exports.moveElement=p;exports.moveElementAwayFromCollision=y;exports.setTopLeft=K;exports.setTopRight=_;exports.setTransform=R;exports.setTransformRtl=S;exports.sortLayoutItemsByRowCol=w;exports.validateLayout=G; | ||
| "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=Symbol("LAYOUT_KEY"),v=Symbol("EMITTER_KEY");function A(r){let t=0,n;for(let e=0,i=r.length;e<i;e++)n=r[e].y+r[e].h,n>t&&(t=n);return t}function Y(r){const t=Array(r.length);for(let n=0,e=r.length;n<e;n++)t[n]=x(r[n]);return t}function x(r){return JSON.parse(JSON.stringify(r))}function g(r,t){return!(r===t||r.x+r.w<=t.x||r.x>=t.x+t.w||r.y+r.h<=t.y||r.y>=t.y+t.h)}function C(r,t,n){const e=w(r),i=y(r),o=Array(r.length);for(let s=0,c=i.length;s<c;s++){let f=i[s];f.static||(f=b(e,f,t,n),e.push(f)),o[r.indexOf(f)]=f,f.moved=!1}return o}function b(r,t,n,e){if(n)for(;t.y>0&&!u(r,t);)t.y--;else if(e){const o=e[t.i].y;for(;t.y>o&&!u(r,t);)t.y--}let i;for(;i=u(r,t);)t.y=i.y+i.h;return t}function O(r,t){const n=w(r);for(let e=0,i=r.length;e<i;e++){const o=r[e];if(o.x+o.w>t.cols&&(o.x=t.cols-o.w),o.x<0&&(o.x=0,o.w=t.cols),!o.static)n.push(o);else for(;u(n,o);)o.y++}return r}function R(r,t){for(let n=0,e=r.length;n<e;n++)if(r[n].i===t)return r[n]}function u(r,t){for(let n=0,e=r.length;n<e;n++)if(g(r[n],t))return r[n]}function E(r,t){return r.filter(n=>g(n,t))}function w(r){return r.filter(t=>t.static)}function m(r,t,n,e,i=!1,o=!1){if(t.static)return r;const s=t.x,c=t.y,f=e&&t.y>e;typeof n=="number"&&(t.x=n),typeof e=="number"&&(t.y=e),t.moved=!0;let h=y(r);f&&(h=h.reverse());const p=E(h,t);if(o&&p.length)return t.x=s,t.y=c,t.moved=!1,r;for(let a=0,L=p.length;a<L;a++){const l=p[a];l.moved||t.y>l.y&&t.y-l.y>l.h/4||(l.static?r=d(r,l,t,i):r=d(r,t,l,i))}return r}function d(r,t,n,e){if(e){const o={x:n.x,y:n.y,w:n.w,h:n.h,i:"-1"};if(o.y=Math.max(t.y-n.h,0),!u(r,o))return m(r,n,void 0,o.y,!1)}return m(r,n,void 0,n.y+1,!1)}function S(r,t,n,e){const i="translate3d("+t+"px,"+r+"px, 0)";return{transform:i,WebkitTransform:i,MozTransform:i,msTransform:i,OTransform:i,width:n+"px",height:e+"px",position:"absolute"}}function K(r,t,n,e){const i="translate3d("+t*-1+"px,"+r+"px, 0)";return{transform:i,WebkitTransform:i,MozTransform:i,msTransform:i,OTransform:i,width:n+"px",height:e+"px",position:"absolute"}}function _(r,t,n,e){return{top:r+"px",left:t+"px",width:n+"px",height:e+"px",position:"absolute"}}function G(r,t,n,e){return{top:r+"px",right:t+"px",width:n+"px",height:e+"px",position:"absolute"}}function y(r){return Array.from(r).sort(function(t,n){return t.y===n.y&&t.x===n.x?0:t.y>n.y||t.y===n.y&&t.x>n.x?1:-1})}function V(r,t){t=t||"Layout";const n=["x","y","w","h"],e=[];if(!Array.isArray(r))throw new Error(t+" must be an array!");for(let i=0,o=r.length;i<o;i++){const s=r[i];for(let c=0;c<n.length;c++)if(typeof s[n[c]]!="number")throw new Error("VueGridLayout: "+t+"["+i+"]."+n[c]+" must be a number!");if(s.i===void 0||s.i===null)throw new Error("VueGridLayout: "+t+"["+i+"].i cannot be null!");if(typeof s.i!="number"&&typeof s.i!="string")throw new Error("VueGridLayout: "+t+"["+i+"].i must be a string or number!");if(e.indexOf(s.i)>=0)throw new Error("VueGridLayout: "+t+"["+i+"].i must be unique!");if(e.push(s.i),s.static!==void 0&&typeof s.static!="boolean")throw new Error("VueGridLayout: "+t+"["+i+"].static must be a boolean!")}}exports.EMITTER_KEY=v;exports.LAYOUT_KEY=T;exports.bottom=A;exports.cloneLayout=Y;exports.cloneLayoutItem=x;exports.collides=g;exports.compact=C;exports.compactItem=b;exports.correctBounds=O;exports.getAllCollisions=E;exports.getFirstCollision=u;exports.getLayoutItem=R;exports.getStatics=w;exports.moveElement=m;exports.moveElementAwayFromCollision=d;exports.setTopLeft=_;exports.setTopRight=G;exports.setTransform=S;exports.setTransformRtl=K;exports.sortLayoutItemsByRowCol=y;exports.validateLayout=V; | ||
| //# sourceMappingURL=common.js.map |
@@ -1,3 +0,3 @@ | ||
| (function(){"use strict";try{if(typeof document<"u"){var i=document.createElement("style");i.appendChild(document.createTextNode(".vue-grid-layout{position:relative;transition:height .2s ease}.vue-grid-item{transition:.2s ease;transition-property:left,top,right}.vue-grid-item.no-touch{touch-action:none}.vue-grid-item.css-transforms{right:auto;left:0;transition-property:transform}.vue-grid-item.css-transforms.render-rtl{right:0;left:auto}.vue-grid-item.resizing{z-index:3;opacity:60%}.vue-grid-item.vue-draggable-dragging{z-index:3;transition:none}.vue-grid-item.vue-grid-placeholder{z-index:2;-webkit-user-select:none;-moz-user-select:none;user-select:none;background:red;opacity:20%;transition-duration:.1s}.vue-grid-item>.vue-resizable-handle{position:absolute;right:0;bottom:0;box-sizing:border-box;width:20px;height:20px;padding:0 3px 3px 0;cursor:se-resize;background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pg08IS0tIEdlbmVyYXRvcjogQWRvYmUgRmlyZXdvcmtzIENTNiwgRXhwb3J0IFNWRyBFeHRlbnNpb24gYnkgQWFyb24gQmVhbGwgKGh0dHA6Ly9maXJld29ya3MuYWJlYWxsLmNvbSkgLiBWZXJzaW9uOiAwLjYuMSAgLS0+DTwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DTxzdmcgaWQ9IlVudGl0bGVkLVBhZ2UlMjAxIiB2aWV3Qm94PSIwIDAgNiA2IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjojZmZmZmZmMDAiIHZlcnNpb249IjEuMSINCXhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiDQl4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjZweCIgaGVpZ2h0PSI2cHgiDT4NCTxnIG9wYWNpdHk9IjAuMzAyIj4NCQk8cGF0aCBkPSJNIDYgNiBMIDAgNiBMIDAgNC4yIEwgNCA0LjIgTCA0LjIgNC4yIEwgNC4yIDAgTCA2IDAgTCA2IDYgTCA2IDYgWiIgZmlsbD0iIzAwMDAwMCIvPg0JPC9nPg08L3N2Zz4=);background-repeat:no-repeat;background-position:bottom right;background-origin:content-box}.vue-grid-item>.vue-rtl-resizable-handle{right:auto;bottom:0;left:0;padding-left:3px;cursor:sw-resize;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAuMDAwMDAwMDAwMDAwMDAyIiBoZWlnaHQ9IjEwLjAwMDAwMDAwMDAwMDAwMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDwhLS0gQ3JlYXRlZCB3aXRoIE1ldGhvZCBEcmF3IC0gaHR0cDovL2dpdGh1Yi5jb20vZHVvcGl4ZWwvTWV0aG9kLURyYXcvIC0tPgogPGc+CiAgPHRpdGxlPmJhY2tncm91bmQ8L3RpdGxlPgogIDxyZWN0IGZpbGw9Im5vbmUiIGlkPSJjYW52YXNfYmFja2dyb3VuZCIgaGVpZ2h0PSIxMiIgd2lkdGg9IjEyIiB5PSItMSIgeD0iLTEiLz4KICA8ZyBkaXNwbGF5PSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgeT0iMCIgeD0iMCIgaGVpZ2h0PSIxMDAlIiB3aWR0aD0iMTAwJSIgaWQ9ImNhbnZhc0dyaWQiPgogICA8cmVjdCBmaWxsPSJ1cmwoI2dyaWRwYXR0ZXJuKSIgc3Ryb2tlLXdpZHRoPSIwIiB5PSIwIiB4PSIwIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIi8+CiAgPC9nPgogPC9nPgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxsaW5lIGNhbnZhcz0iI2ZmZmZmZiIgY2FudmFzLW9wYWNpdHk9IjEiIHN0cm9rZS1saW5lY2FwPSJ1bmRlZmluZWQiIHN0cm9rZS1saW5lam9pbj0idW5kZWZpbmVkIiBpZD0ic3ZnXzEiIHkyPSItNzAuMTc4NDA3IiB4Mj0iMTI0LjQ2NDE3NSIgeTE9Ii0zOC4zOTI3MzciIHgxPSIxNDQuODIxMjg5IiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlPSIjMDAwIiBmaWxsPSJub25lIi8+CiAgPGxpbmUgc3Ryb2tlPSIjNjY2NjY2IiBzdHJva2UtbGluZWNhcD0idW5kZWZpbmVkIiBzdHJva2UtbGluZWpvaW49InVuZGVmaW5lZCIgaWQ9InN2Z181IiB5Mj0iOS4xMDY5NTciIHgyPSIwLjk0NzI0NyIgeTE9Ii0wLjAxODEyOCIgeDE9IjAuOTQ3MjQ3IiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiLz4KICA8bGluZSBzdHJva2UtbGluZWNhcD0idW5kZWZpbmVkIiBzdHJva2UtbGluZWpvaW49InVuZGVmaW5lZCIgaWQ9InN2Z183IiB5Mj0iOSIgeDI9IjEwLjA3MzUyOSIgeTE9IjkiIHgxPSItMC42NTU2NCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiM2NjY2NjYiIGZpbGw9Im5vbmUiLz4KIDwvZz4KPC9zdmc+);background-repeat:no-repeat;background-position:bottom left;background-origin:content-box}.vue-grid-item.disable-userselect{-webkit-user-select:none;-moz-user-select:none;user-select:none}")),document.head.appendChild(i)}}catch(I){console.error("vite-plugin-css-injected-by-js",I)}})(); | ||
| (function(){"use strict";try{if(typeof document<"u"){var i=document.createElement("style");i.appendChild(document.createTextNode(".vue-grid-layout{--vgl-placeholder-bg: red;--vgl-placeholder-opacity: 20%;--vgl-placeholder-z-index: 2;--vgl-item-resizing-z-index: 3;--vgl-item-resizing-opacity: 60%;--vgl-item-dragging-z-index: 3;--vgl-item-dragging-opacity: 100%;position:relative;transition:height .2s ease}.vue-grid-item{transition:.2s ease;transition-property:left,top,right}.vue-grid-item.no-touch{touch-action:none}.vue-grid-item.css-transforms{right:auto;left:0;transition-property:transform}.vue-grid-item.css-transforms.render-rtl{right:0;left:auto}.vue-grid-item.resizing{z-index:var(--vgl-item-resizing-z-index, 3);opacity:var(--vgl-item-resizing-opacity, 60%)}.vue-grid-item.vue-draggable-dragging{z-index:var(--vgl-item-dragging-z-index, 3);opacity:var(--vgl-item-dragging-opacity, 100%);transition:none}.vue-grid-item.vue-grid-placeholder{z-index:var(--vgl-placeholder-z-index, 2);-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:var(--vgl-placeholder-bg, red);opacity:var(--vgl-placeholder-opacity, 20%);transition-duration:.1s}.vue-grid-item>.vue-resizable-handle{position:absolute;right:0;bottom:0;box-sizing:border-box;width:20px;height:20px;padding:0 3px 3px 0;cursor:se-resize;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pg08IS0tIEdlbmVyYXRvcjogQWRvYmUgRmlyZXdvcmtzIENTNiwgRXhwb3J0IFNWRyBFeHRlbnNpb24gYnkgQWFyb24gQmVhbGwgKGh0dHA6Ly9maXJld29ya3MuYWJlYWxsLmNvbSkgLiBWZXJzaW9uOiAwLjYuMSAgLS0+DTwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DTxzdmcgaWQ9IlVudGl0bGVkLVBhZ2UlMjAxIiB2aWV3Qm94PSIwIDAgNiA2IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjojZmZmZmZmMDAiIHZlcnNpb249IjEuMSINCXhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiDQl4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjZweCIgaGVpZ2h0PSI2cHgiDT4NCTxnIG9wYWNpdHk9IjAuMzAyIj4NCQk8cGF0aCBkPSJNIDYgNiBMIDAgNiBMIDAgNC4yIEwgNCA0LjIgTCA0LjIgNC4yIEwgNC4yIDAgTCA2IDAgTCA2IDYgTCA2IDYgWiIgZmlsbD0iIzAwMDAwMCIvPg0JPC9nPg08L3N2Zz4=);background-repeat:no-repeat;background-position:bottom right;background-origin:content-box}.vue-grid-item>.vue-rtl-resizable-handle{right:auto;bottom:0;left:0;padding-left:3px;cursor:sw-resize;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAuMDAwMDAwMDAwMDAwMDAyIiBoZWlnaHQ9IjEwLjAwMDAwMDAwMDAwMDAwMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDwhLS0gQ3JlYXRlZCB3aXRoIE1ldGhvZCBEcmF3IC0gaHR0cDovL2dpdGh1Yi5jb20vZHVvcGl4ZWwvTWV0aG9kLURyYXcvIC0tPgogPGc+CiAgPHRpdGxlPmJhY2tncm91bmQ8L3RpdGxlPgogIDxyZWN0IGZpbGw9Im5vbmUiIGlkPSJjYW52YXNfYmFja2dyb3VuZCIgaGVpZ2h0PSIxMiIgd2lkdGg9IjEyIiB5PSItMSIgeD0iLTEiLz4KICA8ZyBkaXNwbGF5PSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgeT0iMCIgeD0iMCIgaGVpZ2h0PSIxMDAlIiB3aWR0aD0iMTAwJSIgaWQ9ImNhbnZhc0dyaWQiPgogICA8cmVjdCBmaWxsPSJ1cmwoI2dyaWRwYXR0ZXJuKSIgc3Ryb2tlLXdpZHRoPSIwIiB5PSIwIiB4PSIwIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIi8+CiAgPC9nPgogPC9nPgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxsaW5lIGNhbnZhcz0iI2ZmZmZmZiIgY2FudmFzLW9wYWNpdHk9IjEiIHN0cm9rZS1saW5lY2FwPSJ1bmRlZmluZWQiIHN0cm9rZS1saW5lam9pbj0idW5kZWZpbmVkIiBpZD0ic3ZnXzEiIHkyPSItNzAuMTc4NDA3IiB4Mj0iMTI0LjQ2NDE3NSIgeTE9Ii0zOC4zOTI3MzciIHgxPSIxNDQuODIxMjg5IiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlPSIjMDAwIiBmaWxsPSJub25lIi8+CiAgPGxpbmUgc3Ryb2tlPSIjNjY2NjY2IiBzdHJva2UtbGluZWNhcD0idW5kZWZpbmVkIiBzdHJva2UtbGluZWpvaW49InVuZGVmaW5lZCIgaWQ9InN2Z181IiB5Mj0iOS4xMDY5NTciIHgyPSIwLjk0NzI0NyIgeTE9Ii0wLjAxODEyOCIgeDE9IjAuOTQ3MjQ3IiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiLz4KICA8bGluZSBzdHJva2UtbGluZWNhcD0idW5kZWZpbmVkIiBzdHJva2UtbGluZWpvaW49InVuZGVmaW5lZCIgaWQ9InN2Z183IiB5Mj0iOSIgeDI9IjEwLjA3MzUyOSIgeTE9IjkiIHgxPSItMC42NTU2NCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiM2NjY2NjYiIGZpbGw9Im5vbmUiLz4KIDwvZz4KPC9zdmc+);background-repeat:no-repeat;background-position:bottom left;background-origin:content-box}.vue-grid-item .disable-userselect{-webkit-user-select:none;-moz-user-select:none;user-select:none}")),document.head.appendChild(i)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})(); | ||
| "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("./style.scss.js");const e=require("./components/grid-layout.vue.js"),t=require("./components/grid-item.vue.js");exports.GridLayout=e;exports.GridItem=t; | ||
| //# sourceMappingURL=index.js.map |
| { | ||
| "name": "grid-layout-plus", | ||
| "version": "0.0.0", | ||
| "version": "1.0.0-beta.0", | ||
| "type": "module", | ||
@@ -10,3 +10,3 @@ "license": "MIT", | ||
| "module": "es/index.mjs", | ||
| "types": "dist/components/index.d.ts", | ||
| "types": "dist/index.d.ts", | ||
| "exports": { | ||
@@ -16,3 +16,3 @@ ".": { | ||
| "require": "./lib/index.cjs", | ||
| "types": "./dist/components/index.d.ts" | ||
| "types": "./dist/index.d.ts" | ||
| }, | ||
@@ -34,4 +34,9 @@ "./es": "./es/index.mjs", | ||
| "devDependencies": { | ||
| "@commitlint/cli": "^17.5.1", | ||
| "@interactjs/types": "^1.10.17", | ||
| "@types/minimist": "^1.2.2", | ||
| "@types/node": "^18.15.11", | ||
| "@types/prettier": "^2.7.2", | ||
| "@types/prompts": "^2.4.4", | ||
| "@types/semver": "^7.3.13", | ||
| "@vexip-ui/commitlint-config": "^0.1.0", | ||
@@ -42,4 +47,6 @@ "@vexip-ui/eslint-config": "^0.5.2", | ||
| "@vitejs/plugin-vue": "^4.1.0", | ||
| "@vitejs/plugin-vue-jsx": "^3.0.1", | ||
| "@vue/test-utils": "^2.3.2", | ||
| "autoprefixer": "^10.4.14", | ||
| "conventional-changelog-cli": "^2.2.2", | ||
| "eslint": "^8.37.0", | ||
@@ -49,6 +56,12 @@ "execa": "^7.1.1", | ||
| "husky": "^8.0.3", | ||
| "is-ci": "^3.0.1", | ||
| "kolorist": "^1.7.0", | ||
| "lint-staged": "^13.2.0", | ||
| "minimist": "^1.2.8", | ||
| "pinst": "^3.0.0", | ||
| "postcss": "^8.4.21", | ||
| "prettier": "^2.8.7", | ||
| "prompts": "^2.4.2", | ||
| "sass": "^1.61.0", | ||
| "semver": "^7.3.8", | ||
| "stylelint": "^15.3.0", | ||
@@ -69,4 +82,20 @@ "stylelint-prettier": "^3.0.0", | ||
| "build": "tsx scripts/build.ts", | ||
| "serve": "pnpm -C dev-server serve" | ||
| "build:docs": "pnpm -C docs build", | ||
| "serve": "pnpm -C dev-server serve", | ||
| "serve:docs": "pnpm -C docs serve", | ||
| "lint": "eslint --fix --ext .js,.ts,.tsx,.vue src/** dev-server/** docs/**", | ||
| "lint:scripts": "eslint --fix --ext .js,.ts scripts/**", | ||
| "lint:style": "stylelint **/*.{vue,scss} --fix", | ||
| "lint:test": "eslint --ext .js,.ts,.tsx,.vue src/** dev-server/** docs/** scripts/** && stylelint **/*.{vue,scss}", | ||
| "precommit": "lint-staged -c ./.husky/.lintstagedrc -q", | ||
| "preinstall": "npx only-allow pnpm", | ||
| "prettier": "prettier --write \"{src,dev-server,docs}/**/*.{ts,js,json,css,pcss,scss,vue,html,md}\"", | ||
| "prettier:scripts": "prettier --write \"scripts/**/*.{ts,js,json}\"", | ||
| "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s --commit-path .", | ||
| "publish:ci": "tsx scripts/publish.ts", | ||
| "release": "tsx scripts/release.ts", | ||
| "test": "vitest run", | ||
| "test:cover": "vitest run --coverage", | ||
| "test:dev": "vitest dev" | ||
| } | ||
| } |
@@ -1,24 +0,40 @@ | ||
| # Grid Layout Plus | ||
| <p align="center"> | ||
| <a href="https://grid-layout-plus.netlify.app/" target="_blank" rel="noopener noreferrer"> | ||
| <img src="./docs/public/grid-layout-plus.svg" width="180" style="width: 120px;" /> | ||
| </a> | ||
| </p> | ||
| This project is forked from [vue-grid-layout](https://github.com/jbaysolutions/vue-grid-layout) and is migrated to Vue 3. | ||
| <h1 align="center">Grip Layout Plus</h1> | ||
| 🚧 Work in progress, alpha coming soon. | ||
| <p align="center"> | ||
| <a href="https://www.npmjs.com/package/grid-layout-plus" target="_blank"> | ||
| <img src="https://img.shields.io/github/package-json/v/qmhc/grid-layout-plus" alt="npm version"/> | ||
| </a> | ||
| </p> | ||
| ## What is Vue Grid Layout? | ||
| ## What is Grid Layout Plus? | ||
| vue-grid-layout is a grid layout system, like [Gridster](http://dsmorse.github.io/gridster.js/), for Vue.js. **Heavily inspired by [React-Grid-Layout](https://github.com/STRML/react-grid-layout)** | ||
| Vue Grid Layout is a grid layout system for Vue 2, like [Gridster](http://dsmorse.github.io/gridster.js/). | ||
| Grid Layout Plus comes from [Vue Grid Layout](https://github.com/jbaysolutions/vue-grid-layout) and is migrated to Vue 3. | ||
| **Heavily inspired by [React Grid Layout](https://github.com/STRML/react-grid-layout).** | ||
| ## Features | ||
| * Draggable widgets | ||
| * Resizable widgets | ||
| * Static widgets | ||
| * Bounds checking for dragging and resizing | ||
| * Widgets may be added or removed without rebuilding grid | ||
| * Layout can be serialized and restored | ||
| * Automatic RTL support (resizing not working with RTL on 2.2.0) | ||
| * Responsive | ||
| - Draggable widgets | ||
| - Resizable widgets | ||
| - Static widgets | ||
| - Bounds checking for dragging and resizing | ||
| - Widgets may be added or removed without rebuilding grid | ||
| - Layout can be serialized and restored | ||
| - Automatic RTL support | ||
| - Responsive | ||
| ## Documentation | ||
| Check out the online documentation [here](https://grid-layout-plus.netlify.app/). | ||
| ## License | ||
| All in [MIT](./LICENSE.md) license. |
@@ -1,3 +0,3 @@ | ||
| import {} from 'node:path' | ||
| import { execa } from 'execa' | ||
| import { logger } from './utils' | ||
@@ -11,9 +11,20 @@ import type { Options } from 'execa' | ||
| async function main() { | ||
| logger.withBothLn(() => logger.successText('start building lib...')) | ||
| await run('vite', ['build', '--config', 'vite.config.ts']) | ||
| logger.ln() | ||
| await run('vite', ['build', '--config', 'vite.full.config.ts']) | ||
| logger.ln() | ||
| if (!process.exitCode) { | ||
| logger.withEndLn(() => logger.success('all builds completed successfully')) | ||
| } | ||
| } | ||
| main().catch(error => { | ||
| console.error(error) | ||
| logger.error(error) | ||
| process.exit(1) | ||
| }) |
@@ -0,0 +0,0 @@ { |
@@ -59,3 +59,3 @@ import type { InjectionKey } from 'vue' | ||
| */ | ||
| export function compact(layout: Layout, verticalCompact: boolean, minPositions?: any): Layout { | ||
| export function compact(layout: Layout, verticalCompact?: boolean, minPositions?: any): Layout { | ||
| // Statics go in the compareWith array right away so items flow around them. | ||
@@ -93,3 +93,3 @@ const compareWith = getStatics(layout) | ||
| */ | ||
| export function compactItem(compareWith: Layout, l: LayoutItem, verticalCompact: boolean, minPositions?: any): LayoutItem { | ||
| export function compactItem(compareWith: Layout, l: LayoutItem, verticalCompact?: boolean, minPositions?: any): LayoutItem { | ||
| if (verticalCompact) { | ||
@@ -188,3 +188,3 @@ // Move the element up as far as it can go without colliding. | ||
| * @param layout Full layout to modify. | ||
| * @param l element to move. | ||
| * @param layoutItem element to move. | ||
| * @param x X position in grid units. | ||
@@ -195,13 +195,13 @@ * @param y Y position in grid units. | ||
| */ | ||
| export function moveElement(layout: Layout, l: LayoutItem, x?: number, y?: number, isUserAction = false, preventCollision = false): Layout { | ||
| if (l.static) return layout | ||
| export function moveElement(layout: Layout, layoutItem: LayoutItem, x?: number, y?: number, isUserAction = false, preventCollision = false): Layout { | ||
| if (layoutItem.static) return layout | ||
| const oldX = l.x | ||
| const oldY = l.y | ||
| const oldX = layoutItem.x | ||
| const oldY = layoutItem.y | ||
| const movingUp = y && l.y > y | ||
| const movingUp = y && layoutItem.y > y | ||
| // This is quite a bit faster than extending the object | ||
| if (typeof x === 'number') l.x = x | ||
| if (typeof y === 'number') l.y = y | ||
| l.moved = true | ||
| if (typeof x === 'number') layoutItem.x = x | ||
| if (typeof y === 'number') layoutItem.y = y | ||
| layoutItem.moved = true | ||
@@ -214,8 +214,8 @@ // If this collides with anything, move it. | ||
| if (movingUp) sorted = sorted.reverse() | ||
| const collisions = getAllCollisions(sorted, l) | ||
| const collisions = getAllCollisions(sorted, layoutItem) | ||
| if (preventCollision && collisions.length) { | ||
| l.x = oldX | ||
| l.y = oldY | ||
| l.moved = false | ||
| layoutItem.x = oldX | ||
| layoutItem.y = oldY | ||
| layoutItem.moved = false | ||
| return layout | ||
@@ -233,9 +233,9 @@ } | ||
| // This makes it feel a bit more precise by waiting to swap for just a bit when moving up. | ||
| if (l.y > collision.y && l.y - collision.y > collision.h / 4) continue | ||
| if (layoutItem.y > collision.y && layoutItem.y - collision.y > collision.h / 4) continue | ||
| // Don't move static items - we have to move *this* element away | ||
| if (collision.static) { | ||
| layout = moveElementAwayFromCollision(layout, collision, l, isUserAction) | ||
| layout = moveElementAwayFromCollision(layout, collision, layoutItem, isUserAction) | ||
| } else { | ||
| layout = moveElementAwayFromCollision(layout, l, collision, isUserAction) | ||
| layout = moveElementAwayFromCollision(layout, layoutItem, collision, isUserAction) | ||
| } | ||
@@ -242,0 +242,0 @@ } |
| let currentDir: 'ltr' | 'rtl' | 'auto' = 'auto' | ||
| // let currentDir = "auto"; | ||
@@ -4,0 +3,0 @@ function hasDocument() { |
@@ -1,3 +0,1 @@ | ||
| // @flow | ||
| import { cloneLayout, compact, correctBounds } from './common' | ||
@@ -4,0 +2,0 @@ |
@@ -1,12 +0,22 @@ | ||
| export type LayoutItemRequired = { w: number, h: number, x: number, y: number, i: number | string } | ||
| export type LayoutItem = LayoutItemRequired & | ||
| { | ||
| minW?: number, minH?: number, maxW?: number, maxH?: number, | ||
| moved?: boolean, static?: boolean, | ||
| isDraggable?: boolean, isResizable?: boolean | ||
| export interface LayoutItemRequired { | ||
| w: number, | ||
| h: number, | ||
| x: number, | ||
| y: number, | ||
| i: number | string | ||
| } | ||
| export interface LayoutItem extends LayoutItemRequired { | ||
| minW?: number, | ||
| minH?: number, | ||
| maxW?: number, | ||
| maxH?: number, | ||
| moved?: boolean, | ||
| static?: boolean, | ||
| isDraggable?: boolean, | ||
| isResizable?: boolean | ||
| } | ||
| export type Layout = Array<LayoutItem> | ||
| export type Size = { width: number, height: number } | ||
| export type Breakpoint = 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | ||
@@ -13,0 +23,0 @@ export type Breakpoints = Record<Breakpoint, number> |
@@ -5,2 +5,3 @@ import './style.scss' | ||
| export { default as GridItem } from './components/grid-item.vue' | ||
| export * from './helpers/types' |
@@ -18,7 +18,5 @@ { | ||
| "baseUrl": ".", | ||
| "paths": { | ||
| "@/*": ["src/*"] | ||
| }, | ||
| "types": [ | ||
| "node" | ||
| "node", | ||
| "vite/client" | ||
| ], | ||
@@ -25,0 +23,0 @@ "lib": [ |
| import { resolve } from 'node:path' | ||
| import { readFileSync } from 'node:fs' | ||
| import { defineConfig } from 'vite' | ||
@@ -7,9 +8,18 @@ import vue from '@vitejs/plugin-vue' | ||
| interface Manifest { | ||
| dependencies?: Record<string, string>, | ||
| peerDependencies?: Record<string, string>, | ||
| version?: string | ||
| } | ||
| const pkg = JSON.parse(readFileSync(resolve(__dirname, 'package.json'), 'utf-8')) as Manifest | ||
| const externalPkgs = ['@vue'].concat( | ||
| Object.keys(pkg.dependencies || {}), | ||
| Object.keys(pkg.peerDependencies || {}) | ||
| ) | ||
| const external = (id: string) => externalPkgs.some(p => p === id || id.startsWith(`${p}/`)) | ||
| export default defineConfig(async () => { | ||
| return { | ||
| resolve: { | ||
| alias: [ | ||
| { find: /^@\/(.+)/, replacement: resolve(__dirname, 'src/$1') } | ||
| ] | ||
| }, | ||
| esbuild: { | ||
@@ -33,3 +43,3 @@ drop: ['debugger'], | ||
| input: [resolve(__dirname, 'src/index.ts')], | ||
| external: ['vue'], | ||
| external, | ||
| output: [ | ||
@@ -36,0 +46,0 @@ { |
@@ -11,7 +11,2 @@ import { resolve } from 'node:path' | ||
| publicDir: false, | ||
| resolve: { | ||
| alias: [ | ||
| { find: /^@\/(.+)/, replacement: resolve(__dirname, 'src/$1') } | ||
| ] | ||
| }, | ||
| esbuild: { | ||
@@ -18,0 +13,0 @@ drop: ['debugger'], |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Install scripts
Supply chain riskInstall scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by27.34%
311194
- Number of package files
- increased by67.95%
131
- Lines of code
- increased by62%
2012
- Number of lines in readme file
- increased by64%
41
Worsened metrics
- Dev dependency count
- increased by50%
39
- Number of high supply chain risk alerts
- increased byInfinity%
1
No dependency changes