rei-mirrors/dockview
1
0
Fork 0
mirror of https://github.com/mathuo/dockview synced 2025-01-23 18:05:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #617 from mathuo/562-dockview-framework-wrappers-vuejs-angular-javascript-etc-3

Browse Source 
chore: vue3 docs
This commit is contained in:
mathuo 2024-05-30 20:44:23 +01:00 committed by GitHub
commit 943c2dc425
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
21 changed files with 98 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
packages/docs/sandboxes/react/dockview/demo-dockview/src/app.tsx
View File

@ -26,6 +26,7 @@ const components = {
overflow: 'auto',
color: 'white',
position: 'relative',
border: 'var(--demo-border)',
}}
>
{/* <Table data={metadata} /> */}
@ -180,6 +181,19 @@ const DockviewDemo = (props: { theme?: string }) => {
const [watermark, setWatermark] = React.useState<boolean>(false);
const [gapCheck, setGapCheck] = React.useState<boolean>(false);
const css = React.useMemo(() => {
if (!gapCheck) {
return {};
}
return {
'--dv-group-gap-size': '0.5rem',
'--demo-border': '5px dashed purple',
} as React.CSSProperties;
}, [gapCheck]);
return (
<div
style={{
@ -190,6 +204,7 @@ const DockviewDemo = (props: { theme?: string }) => {
padding: '8px',
backgroundColor: 'rgba(0,0,50,0.25)',
borderRadius: '8px',
...css,
}}
>
<div>
@ -212,6 +227,15 @@ const DockviewDemo = (props: { theme?: string }) => {
activeGroup={activeGroup}
/>
)}
{/* <div>
<button
onClick={() => {
setGapCheck(!gapCheck);
}}
>
{gapCheck ? 'Disable Gap Check' : 'Enable Gap Check'}
</button>
</div> */}
</div>
<div
style={{

2
packages/docs/src/components/ui/codeRunner.tsx
View File

@ -3,7 +3,7 @@ import { useActiveFramework } from '../frameworkSpecific';
import BrowserOnly from '@docusaurus/BrowserOnly';
const BASE_SANDBOX_URL =
'https://codesandbox.io/s/github/mathuo/dockview/tree/master/packages/docs';
'https://codesandbox.io/s/github/mathuo/dockview/tree/gh-pages';
export const _CodeRunner = (props: { id: string; height: number }) => {
const [framework] = useActiveFramework();

32
packages/docs/templates/dockview/basic/vue/package.json vendored
View File

@ -1,32 +0,0 @@
{
"name": "dockview.resize",
"description": "",
"keywords": [
"dockview"
],
"version": "1.0.0",
"main": "src/index.tsx",
"dependencies": {
"dockview": "*",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@types/react": "^18.0.28",
"@types/react-dom": "^18.0.11",
"typescript": "^4.9.5",
"react-scripts": "*"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}

9
packages/docs/templates/dockview/basic/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

18
packages/docs/templates/dockview/basic/vue/tsconfig.json vendored
View File

@ -1,18 +0,0 @@
{
"compilerOptions": {
"outDir": "build/dist",
"module": "esnext",
"target": "es5",
"lib": ["es6", "dom"],
"sourceMap": true,
"allowJs": true,
"jsx": "react-jsx",
"moduleResolution": "node",
"rootDir": "src",
"forceConsistentCasingInFileNames": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": true,
"strictNullChecks": true
}
}

6
packages/docs/templates/dockview/custom-header/vue/src/index.ts vendored
View File

@ -1,11 +1,11 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelHeaderProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

6
packages/docs/templates/dockview/floating-groups/vue/src/index.ts vendored
View File

@ -1,12 +1,12 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewApi,
DockviewReadyEvent,
IDockviewHeaderActionsProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
let panelCount = 0;

6
packages/docs/templates/dockview/group-actions/vue/src/index.ts vendored
View File

@ -1,11 +1,11 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewHeaderActionsProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
import './app.css';
const LeftAction = defineComponent({

6
packages/docs/templates/dockview/layout/vue/src/index.ts vendored
View File

@ -1,12 +1,12 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewApi,
DockviewReadyEvent,
IDockviewHeaderActionsProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
let panelCount = 0;

9
packages/docs/templates/dockview/locked/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

9
packages/docs/templates/dockview/maximize-group/vue/src/index.ts vendored
View File

@ -1,11 +1,12 @@
import 'dockview-core/dist/styles/dockview.css';
import { Prop, PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewHeaderActionsProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
let panelCount = 0;

9
packages/docs/templates/dockview/nested/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

6
packages/docs/templates/dockview/popout-group/vue/src/index.ts vendored
View File

@ -1,12 +1,12 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewApi,
DockviewReadyEvent,
IDockviewHeaderActionsProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
let panelCount = 0;

9
packages/docs/templates/dockview/render-mode/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

9
packages/docs/templates/dockview/resize-container/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

9
packages/docs/templates/dockview/resize/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
import './resize.css';
const Panel = defineComponent({

5
packages/docs/templates/dockview/scrollbars/vue/src/index.ts vendored
View File

@ -1,7 +1,6 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent } from 'dockview-core';
import { DockviewVue, DockviewReadyEvent } from 'dockview-vue';
const TEXT =
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.';

6
packages/docs/templates/dockview/tabview/vue/src/index.ts vendored
View File

@ -1,11 +1,11 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewApi,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

6
packages/docs/templates/dockview/update-parameters/vue/src/index.ts vendored
View File

@ -1,11 +1,11 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelHeaderProps,
IDockviewPanelProps,
} from 'dockview-core';
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

9
packages/docs/templates/dockview/update-title/vue/src/index.ts vendored
View File

@ -1,7 +1,10 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import { DockviewReadyEvent, IDockviewPanelProps } from 'dockview-core';
import {
DockviewVue,
DockviewReadyEvent,
IDockviewPanelProps,
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',

6
packages/docs/templates/dockview/watermark/vue/src/index.ts vendored
View File

@ -1,13 +1,13 @@
import 'dockview-core/dist/styles/dockview.css';
import 'dockview-vue/dist/styles/dockview.css';
import { PropType, createApp, defineComponent } from 'vue';
import { DockviewVue } from 'dockview-vue';
import {
DockviewVue,
DockviewApi,
DockviewReadyEvent,
IDockviewPanelProps,
IWatermarkPanelProps,
Orientation,
} from 'dockview-core';
} from 'dockview-vue';
const Panel = defineComponent({
name: 'Panel',