Skip to content

Commit a63cb30

Browse files
Build
1 parent 36c2ef2 commit a63cb30

15 files changed

+1316
-0
lines changed

dist/plugin/VResizeDrawer.vue.d.ts

+137
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,137 @@
1+
import { Props } from '../types';
2+
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
3+
absolute?: boolean | undefined;
4+
expandOnHover?: boolean | undefined;
5+
floating?: boolean | undefined;
6+
handleBorderWidth?: string | number | undefined;
7+
handleColor?: string | undefined;
8+
handleIcon?: string | undefined;
9+
handleIconSize?: string | undefined;
10+
handlePosition?: import('../types').HandlePositions | undefined;
11+
height?: string | number | undefined;
12+
location?: import('../types').DrawerLocations;
13+
maxWidth?: string | number | undefined;
14+
minWidth?: string | number | undefined;
15+
modelValue?: boolean | null | undefined;
16+
name?: string | undefined;
17+
rail?: boolean | null | undefined;
18+
railWidth?: string | number | undefined;
19+
resizable?: boolean | undefined;
20+
saveWidth?: boolean | undefined;
21+
storageName?: string | undefined;
22+
storageType?: import('../types').StorageType | undefined;
23+
tag?: string | undefined;
24+
temporary?: boolean | undefined;
25+
touchless?: boolean | undefined;
26+
theme?: string | undefined;
27+
width?: string | number | undefined;
28+
widthSnapBack?: boolean | undefined;
29+
}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
30+
"handle:click": (...args: any[]) => void;
31+
"handle:dblclick": (...args: any[]) => void;
32+
"handle:drag": (...args: any[]) => void;
33+
"handle:mousedown": (...args: any[]) => void;
34+
"handle:mouseup": (...args: any[]) => void;
35+
"handle:touchend": (...args: any[]) => void;
36+
"handle:touchmove": (...args: any[]) => void;
37+
"handle:touchstart": (...args: any[]) => void;
38+
close: (...args: any[]) => void;
39+
"drawer:mouseenter": (...args: any[]) => void;
40+
"drawer:mouseleave": (...args: any[]) => void;
41+
"update:modelValue": (...args: any[]) => void;
42+
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
43+
absolute?: boolean | undefined;
44+
expandOnHover?: boolean | undefined;
45+
floating?: boolean | undefined;
46+
handleBorderWidth?: string | number | undefined;
47+
handleColor?: string | undefined;
48+
handleIcon?: string | undefined;
49+
handleIconSize?: string | undefined;
50+
handlePosition?: import('../types').HandlePositions | undefined;
51+
height?: string | number | undefined;
52+
location?: import('../types').DrawerLocations;
53+
maxWidth?: string | number | undefined;
54+
minWidth?: string | number | undefined;
55+
modelValue?: boolean | null | undefined;
56+
name?: string | undefined;
57+
rail?: boolean | null | undefined;
58+
railWidth?: string | number | undefined;
59+
resizable?: boolean | undefined;
60+
saveWidth?: boolean | undefined;
61+
storageName?: string | undefined;
62+
storageType?: import('../types').StorageType | undefined;
63+
tag?: string | undefined;
64+
temporary?: boolean | undefined;
65+
touchless?: boolean | undefined;
66+
theme?: string | undefined;
67+
width?: string | number | undefined;
68+
widthSnapBack?: boolean | undefined;
69+
}>>> & {
70+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
71+
"onHandle:click"?: ((...args: any[]) => any) | undefined;
72+
"onHandle:dblclick"?: ((...args: any[]) => any) | undefined;
73+
"onHandle:drag"?: ((...args: any[]) => any) | undefined;
74+
"onHandle:mousedown"?: ((...args: any[]) => any) | undefined;
75+
"onHandle:mouseup"?: ((...args: any[]) => any) | undefined;
76+
"onHandle:touchend"?: ((...args: any[]) => any) | undefined;
77+
"onHandle:touchmove"?: ((...args: any[]) => any) | undefined;
78+
"onHandle:touchstart"?: ((...args: any[]) => any) | undefined;
79+
onClose?: ((...args: any[]) => any) | undefined;
80+
"onDrawer:mouseenter"?: ((...args: any[]) => any) | undefined;
81+
"onDrawer:mouseleave"?: ((...args: any[]) => any) | undefined;
82+
}, {
83+
theme: string;
84+
tag: string;
85+
name: string;
86+
absolute: boolean;
87+
expandOnHover: boolean;
88+
floating: boolean;
89+
modelValue: boolean | null;
90+
rail: boolean | null;
91+
railWidth: string | number;
92+
temporary: boolean;
93+
touchless: boolean;
94+
width: string | number;
95+
location: "end" | "start" | "left" | "right";
96+
storageName: string;
97+
saveWidth: boolean;
98+
handlePosition: import('../types').HandlePositions;
99+
maxWidth: string | number;
100+
minWidth: string | number;
101+
widthSnapBack: boolean;
102+
handleBorderWidth: string | number;
103+
handleColor: string;
104+
handleIconSize: string;
105+
storageType: import('../types').StorageType;
106+
height: string | number;
107+
handleIcon: string;
108+
resizable: boolean;
109+
}, {}>, {
110+
handle?(_: {}): any;
111+
prepend?(_: {}): any;
112+
default?(_: {}): any;
113+
append?(_: {}): any;
114+
}>;
115+
export default _default;
116+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
117+
type __VLS_TypePropsToRuntimeProps<T> = {
118+
[K in keyof T]-?: {} extends Pick<T, K> ? {
119+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
120+
} : {
121+
type: import('vue').PropType<T[K]>;
122+
required: true;
123+
};
124+
};
125+
type __VLS_WithDefaults<P, D> = {
126+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
127+
default: D[K];
128+
}> : P[K];
129+
};
130+
type __VLS_Prettify<T> = {
131+
[K in keyof T]: T[K];
132+
} & {};
133+
type __VLS_WithTemplateSlots<T, S> = T & {
134+
new (): {
135+
$slots: S;
136+
};
137+
};

dist/plugin/composables/classes.d.ts

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { UseDrawerClasses, UseHandleContainerClasses, UseHandleIconClasses } from '../../types';
2+
export declare const useDrawerClasses: UseDrawerClasses;
3+
export declare const useHandleContainerClasses: UseHandleContainerClasses;
4+
export declare const useHandleIconClasses: UseHandleIconClasses;

dist/plugin/composables/colors.d.ts

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { ThemeInstance } from 'vuetify';
2+
/**
3+
* Converts single color
4+
*/
5+
export declare const useGetColor: (color: string, theme: ThemeInstance) => string;

dist/plugin/composables/helpers.d.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { UseConvertToUnit } from '../../types';
2+
export declare const useConvertToUnit: UseConvertToUnit;
3+
export declare const useConvertToNumber: (val: string | number) => number;

dist/plugin/composables/icons.d.ts

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
import { UseGetIcon } from '../../types';
2+
export declare const useGetIcon: UseGetIcon;

dist/plugin/composables/storage.d.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { UseSetStorage } from '../../types';
2+
export declare function useGetStorage(storageType: string, storageName: string): string | null;
3+
export declare const useSetStorage: UseSetStorage;

dist/plugin/composables/styles.d.ts

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { UseDrawerStyles, UseHandleContainerStyles, UseHandleIconStyles } from '../../types';
2+
export declare const useDrawerStyles: UseDrawerStyles;
3+
export declare const useHandleContainerStyles: UseHandleContainerStyles;
4+
export declare const useHandleIconStyles: UseHandleIconStyles;

dist/plugin/index.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default as VResizeDrawer } from '../plugin/VResizeDrawer.vue';

dist/plugin/utils/globals.d.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
declare const defaultWidth = 256;
2+
declare const componentName = "v-resize-drawer";
3+
export { defaultWidth, componentName };

dist/plugin/utils/props.d.ts

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
import { Props } from '../../types';
2+
export declare const AllProps: Props;

dist/scss/_mixins.scss

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
@use 'sass:map';
2+
@use 'sass:math';
3+
@use 'vuetify/tools';
4+
@use 'vuetify/settings';
5+
6+
/*
7+
* @source vuetify/packages/vuetify/src/styles/tools/_functions.sass
8+
*/
9+
@function breakpoint-min($name, $breakpoints) {
10+
$min: map-get($breakpoints, $name);
11+
@return if($min !=0, $min, null);
12+
}
13+
14+
/*
15+
* @source vuetify/packages/vuetify/src/styles/tools/_display.sass
16+
*/
17+
@mixin media-breakpoint-up($name, $breakpoints: settings.$grid-breakpoints) {
18+
$min: breakpoint-min($name, $breakpoints);
19+
20+
@if $min {
21+
@container v-resize-drawer (min-width: #{$min}) {
22+
@content;
23+
}
24+
}
25+
}
26+
27+
/*
28+
* @source vuetify/packages/vuetify/src/components/VGrid/_mixins.sass
29+
*/
30+
@mixin make-col($size, $columns: settings.$grid-columns) {
31+
flex: 0 0 math.percentage(math.div($size, $columns));
32+
max-width: math.percentage(math.div($size, $columns));
33+
}
34+
35+
@mixin make-grid-columns($columns: settings.$grid-columns, $gutter: settings.$grid-gutter, $breakpoints: settings.$grid-breakpoints) {
36+
@each $breakpoint in map-keys($breakpoints) {
37+
$infix: tools.breakpoint-infix($breakpoint, $breakpoints);
38+
39+
@include media-breakpoint-up($breakpoint, $breakpoints) {
40+
@for $i from 1 through $columns {
41+
.v-col#{$infix}-#{$i} {
42+
@include make-col($i, $columns);
43+
}
44+
}
45+
}
46+
}
47+
}
48+
49+
/*
50+
* @source vuetify/packages/vuetify/src/styles/utilities/_display.sass
51+
*/
52+
@mixin make-grid-columns-hidden() {
53+
$display: map.get(settings.$utilities, 'display');
54+
55+
@each $size,
56+
$media_query in settings.$display-breakpoints {
57+
@container v-resize-drawer #{$media_query} {
58+
.hidden-#{$size} {
59+
display: none !important;
60+
}
61+
}
62+
63+
@container v-resize-drawer #{$media_query} {
64+
@each $val in map.get($display, 'values') {
65+
.#{map.get($display, 'class')}-#{$size}-#{$val} {
66+
display: $val !important;
67+
}
68+
}
69+
}
70+
}
71+
}

dist/scss/main.scss

+97
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
@use 'sass:map';
2+
@use './mixins' as *;
3+
@use 'vuetify/settings';
4+
5+
.v-resize-drawer {
6+
container-type: inline-size;
7+
container-name: v-resize-drawer;
8+
9+
&--handle {
10+
&-container {
11+
cursor: grab;
12+
align-items: center;
13+
display: flex;
14+
justify-content: center;
15+
position: absolute;
16+
z-index: 1;
17+
18+
&-icon {
19+
&-parent {
20+
&-end,
21+
&-right {
22+
left: initial;
23+
right: 0;
24+
}
25+
}
26+
27+
&-center {
28+
&-end,
29+
&-right {
30+
transform: rotate(180deg);
31+
}
32+
}
33+
34+
&-user-icon {
35+
transform: none;
36+
}
37+
38+
&-fa {
39+
font-size: .7rem !important;
40+
}
41+
}
42+
43+
&-parent {
44+
&-left,
45+
&-start,
46+
&-undefined {
47+
right: 0;
48+
}
49+
50+
&-end,
51+
&-right {
52+
left: 0;
53+
}
54+
}
55+
56+
&-position {
57+
&-top {
58+
top: 0;
59+
}
60+
61+
&-center {
62+
top: 50%;
63+
transform: translateY(-50%);
64+
}
65+
66+
&-bottom {
67+
bottom: 0;
68+
}
69+
70+
&-border {
71+
cursor: col-resize;
72+
height: 100%;
73+
top: 0;
74+
width: 8px;
75+
}
76+
}
77+
}
78+
}
79+
}
80+
81+
@container v-resize-drawer (width > #{map.get(settings.$grid-breakpoints, 'xs')}) and (max-width: #{map.get(settings.$grid-breakpoints, 'sm') - 0.02}) {
82+
.v-col {
83+
&-xs-12 {
84+
flex: 0 0 100% !important;
85+
max-width: 100% !important;
86+
flex-basis: 0;
87+
flex-grow: 1;
88+
max-width: 100%;
89+
}
90+
}
91+
}
92+
93+
// Grid Columns //
94+
@include make-grid-columns;
95+
96+
// Hidden & d-#{size}-#{display-value} Columns //
97+
@include make-grid-columns-hidden;

0 commit comments

Comments
 (0)