@onereach/ui-components 11.11.2-beta.4502.0 → 11.11.2-beta.4503.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundled/v2/{OrList-ec3bc502.js → OrList-a1877407.js} +71 -66
- package/dist/bundled/v2/components/OrListV3/OrList.js +1 -1
- package/dist/bundled/v2/components/OrListV3/OrList.vue.d.ts +13 -28
- package/dist/bundled/v2/components/OrListV3/index.js +1 -1
- package/dist/bundled/v2/components/OrListV3/styles.d.ts +0 -2
- package/dist/bundled/v2/components/OrListV3/styles.js +1 -3
- package/dist/bundled/v2/components/OrSelectV3/OrSelect.js +7 -3
- package/dist/bundled/v2/components/OrSelectV3/OrSelect.vue.d.ts +2 -2
- package/dist/bundled/v2/components/index.js +1 -1
- package/dist/bundled/v2/index.js +1 -1
- package/dist/bundled/v3/components/OrListV3/OrList.js +1 -1
- package/dist/bundled/v3/components/OrListV3/OrList.vue.d.ts +9 -20
- package/dist/bundled/v3/components/OrListV3/index.js +1 -1
- package/dist/bundled/v3/components/OrListV3/styles.d.ts +0 -2
- package/dist/bundled/v3/components/OrListV3/styles.js +1 -1
- package/dist/bundled/v3/components/{OrListV3-fb0f71e8.js → OrListV3-08054afc.js} +67 -68
- package/dist/bundled/v3/components/OrSelectV3/OrSelect.js +1 -1
- package/dist/bundled/v3/components/OrSelectV3/OrSelect.vue.d.ts +1 -1
- package/dist/bundled/v3/components/OrSelectV3/index.js +1 -1
- package/dist/bundled/v3/components/OrSelectV3/styles.js +1 -1
- package/dist/bundled/v3/components/{OrSelectV3-c408277b.js → OrSelectV3-2f570a8e.js} +7 -3
- package/dist/bundled/v3/components/index.js +2 -2
- package/dist/bundled/v3/index.js +2 -2
- package/dist/esm/v2/{OrList-3192132a.js → OrList-d372b256.js} +67 -66
- package/dist/esm/v2/{OrListItem-82ea1e2b.js → OrListItem-1b4b8db3.js} +5 -4
- package/dist/esm/v2/{OrSelect-b9c733f5.js → OrSelect-0a307d1f.js} +7 -3
- package/dist/esm/v2/components/index.js +3 -3
- package/dist/esm/v2/components/or-list-v3/OrList.vue.d.ts +13 -28
- package/dist/esm/v2/components/or-list-v3/index.js +3 -6
- package/dist/esm/v2/components/or-list-v3/partials/index.js +1 -1
- package/dist/esm/v2/components/or-list-v3/partials/or-list-item/OrListItem.vue.d.ts +8 -8
- package/dist/esm/v2/components/or-list-v3/styles.d.ts +0 -2
- package/dist/esm/v2/components/or-select-v3/OrSelect.vue.d.ts +2 -2
- package/dist/esm/v2/components/or-select-v3/index.js +1 -1
- package/dist/esm/v2/index.js +3 -3
- package/dist/esm/v3/{OrList-769c6101.js → OrList-7897e5c3.js} +63 -65
- package/dist/esm/v3/{OrListItem-12fa8abd.js → OrListItem-63389e98.js} +5 -4
- package/dist/esm/v3/{OrSelect-a88e236a.js → OrSelect-fa01e6e5.js} +7 -3
- package/dist/esm/v3/components/index.js +3 -3
- package/dist/esm/v3/components/or-list-v3/OrList.vue.d.ts +9 -20
- package/dist/esm/v3/components/or-list-v3/index.js +3 -5
- package/dist/esm/v3/components/or-list-v3/partials/index.js +1 -1
- package/dist/esm/v3/components/or-list-v3/partials/or-list-item/OrListItem.vue.d.ts +7 -7
- package/dist/esm/v3/components/or-list-v3/styles.d.ts +0 -2
- package/dist/esm/v3/components/or-select-v3/OrSelect.vue.d.ts +1 -1
- package/dist/esm/v3/components/or-select-v3/index.js +1 -1
- package/dist/esm/v3/index.js +3 -3
- package/package.json +1 -1
- package/src/components/or-list-v3/OrList.vue +90 -86
- package/src/components/or-list-v3/partials/or-list-item/OrListItem.vue +5 -5
- package/src/components/or-list-v3/styles.ts +0 -4
- package/src/components/or-select-v3/OrSelect.vue +8 -3
|
@@ -76,8 +76,8 @@ export { L as LabelVariant, _ as OrLabelV3 } from '../OrLabel-bf7e2ea2.js';
|
|
|
76
76
|
export { L as LinkColor, _ as OrLinkV3 } from '../OrLink-30283089.js';
|
|
77
77
|
export { _ as OrList } from '../OrList-24c2dc67.js';
|
|
78
78
|
export { _ as OrListOfInputs } from '../OrListOfInputs-8fe8a224.js';
|
|
79
|
-
export { _ as OrListV3 } from '../OrList-
|
|
80
|
-
export { _ as OrListItem } from '../OrListItem-
|
|
79
|
+
export { _ as OrListV3 } from '../OrList-d372b256.js';
|
|
80
|
+
export { _ as OrListItem } from '../OrListItem-1b4b8db3.js';
|
|
81
81
|
export { L as LoaderViews, _ as OrLoader } from '../OrLoader-84230be7.js';
|
|
82
82
|
export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, _ as OrLoaderV3 } from '../OrLoader-4ac49224.js';
|
|
83
83
|
export { _ as OrMenuItemV3 } from '../OrMenuItem-2e7a2e32.js';
|
|
@@ -109,7 +109,7 @@ export { _ as OrSearch } from '../OrSearch-3f55fbee.js';
|
|
|
109
109
|
export { _ as OrSearchV3 } from '../OrSearch-95314362.js';
|
|
110
110
|
export { _ as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl-db974b3b.js';
|
|
111
111
|
export { _ as OrSelect } from '../OrSelect-629c42c0.js';
|
|
112
|
-
export { _ as OrSelectV3 } from '../OrSelect-
|
|
112
|
+
export { _ as OrSelectV3 } from '../OrSelect-0a307d1f.js';
|
|
113
113
|
export { _ as OrSidebar, O as OrSidebarSide } from '../OrSidebar-054b26c6.js';
|
|
114
114
|
export { _ as OrSidebarV3, S as SidebarPlacement } from '../props-6bf01263.js';
|
|
115
115
|
export { _ as OrSkeletonCircle } from '../OrSkeletonCircle-c4bf0e34.js';
|
|
@@ -2,12 +2,10 @@ import { PropType } from 'vue-demi';
|
|
|
2
2
|
import { ListItem } from './types';
|
|
3
3
|
declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
4
4
|
root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
5
|
-
rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
6
|
-
headerStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
7
5
|
content: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
6
|
+
rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
8
7
|
contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
9
|
-
|
|
10
|
-
model: import("../../hooks").UseProxyModelValueReturn<ListItem[]>;
|
|
8
|
+
proxyModelValue: import("../../hooks").UseProxyModelValueReturn<ListItem[]>;
|
|
11
9
|
addItem: () => void;
|
|
12
10
|
deleteItem: (index: number) => void;
|
|
13
11
|
uuid: (<T extends ArrayLike<number>>(options: import("uuid").V4Options | null | undefined, buffer: T, offset?: number | undefined) => T) & ((options?: import("uuid").V4Options | undefined) => string);
|
|
@@ -28,9 +26,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
28
26
|
type: StringConstructor;
|
|
29
27
|
default: undefined;
|
|
30
28
|
};
|
|
31
|
-
|
|
32
|
-
type:
|
|
33
|
-
default:
|
|
29
|
+
disabled: {
|
|
30
|
+
type: BooleanConstructor;
|
|
31
|
+
default: boolean;
|
|
34
32
|
};
|
|
35
33
|
canAdd: {
|
|
36
34
|
type: BooleanConstructor;
|
|
@@ -44,10 +42,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
44
42
|
type: BooleanConstructor;
|
|
45
43
|
default: boolean;
|
|
46
44
|
};
|
|
47
|
-
disabled: {
|
|
48
|
-
type: BooleanConstructor;
|
|
49
|
-
default: boolean;
|
|
50
|
-
};
|
|
51
45
|
}, import("@vue/composition-api").ExtractPropTypes<{
|
|
52
46
|
modelValue: {
|
|
53
47
|
type: PropType<ListItem[]>;
|
|
@@ -65,9 +59,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
65
59
|
type: StringConstructor;
|
|
66
60
|
default: undefined;
|
|
67
61
|
};
|
|
68
|
-
|
|
69
|
-
type:
|
|
70
|
-
default:
|
|
62
|
+
disabled: {
|
|
63
|
+
type: BooleanConstructor;
|
|
64
|
+
default: boolean;
|
|
71
65
|
};
|
|
72
66
|
canAdd: {
|
|
73
67
|
type: BooleanConstructor;
|
|
@@ -81,30 +75,23 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
81
75
|
type: BooleanConstructor;
|
|
82
76
|
default: boolean;
|
|
83
77
|
};
|
|
84
|
-
disabled: {
|
|
85
|
-
type: BooleanConstructor;
|
|
86
|
-
default: boolean;
|
|
87
|
-
};
|
|
88
78
|
}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
|
|
89
79
|
modelValue: ListItem[];
|
|
90
80
|
selection: ListItem[];
|
|
91
81
|
itemFactory: () => ListItem;
|
|
92
82
|
label: string;
|
|
93
|
-
|
|
83
|
+
disabled: boolean;
|
|
94
84
|
canAdd: boolean;
|
|
95
85
|
canDelete: boolean;
|
|
96
86
|
canReorder: boolean;
|
|
97
|
-
disabled: boolean;
|
|
98
87
|
} & {} & {
|
|
99
88
|
[x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
|
|
100
89
|
}, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
101
90
|
root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
102
|
-
rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
103
|
-
headerStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
104
91
|
content: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
92
|
+
rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
105
93
|
contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
106
|
-
|
|
107
|
-
model: import("../../hooks").UseProxyModelValueReturn<ListItem[]>;
|
|
94
|
+
proxyModelValue: import("../../hooks").UseProxyModelValueReturn<ListItem[]>;
|
|
108
95
|
addItem: () => void;
|
|
109
96
|
deleteItem: (index: number) => void;
|
|
110
97
|
uuid: (<T extends ArrayLike<number>>(options: import("uuid").V4Options | null | undefined, buffer: T, offset?: number | undefined) => T) & ((options?: import("uuid").V4Options | undefined) => string);
|
|
@@ -113,11 +100,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
113
100
|
selection: ListItem[];
|
|
114
101
|
itemFactory: () => ListItem;
|
|
115
102
|
label: string;
|
|
116
|
-
|
|
103
|
+
disabled: boolean;
|
|
117
104
|
canAdd: boolean;
|
|
118
105
|
canDelete: boolean;
|
|
119
106
|
canReorder: boolean;
|
|
120
|
-
disabled: boolean;
|
|
121
107
|
} & {} & {
|
|
122
108
|
[x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
|
|
123
109
|
}, {
|
|
@@ -125,10 +111,9 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
125
111
|
selection: ListItem[];
|
|
126
112
|
itemFactory: () => ListItem;
|
|
127
113
|
label: string;
|
|
128
|
-
|
|
114
|
+
disabled: boolean;
|
|
129
115
|
canAdd: boolean;
|
|
130
116
|
canDelete: boolean;
|
|
131
117
|
canReorder: boolean;
|
|
132
|
-
disabled: boolean;
|
|
133
118
|
}, true>);
|
|
134
119
|
export default _default;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { _ as OrListV3 } from '../../OrList-
|
|
2
|
-
export { _ as OrListItem } from '../../OrListItem-
|
|
1
|
+
export { _ as OrListV3 } from '../../OrList-d372b256.js';
|
|
2
|
+
export { _ as OrListItem } from '../../OrListItem-1b4b8db3.js';
|
|
3
3
|
import 'sortablejs';
|
|
4
4
|
import 'uuid';
|
|
5
5
|
import 'vue-demi';
|
|
@@ -11,12 +11,9 @@ import '@vueuse/core';
|
|
|
11
11
|
import '../../useProxyModelValue-940010d2.js';
|
|
12
12
|
import '@onereach/styles/screens.json';
|
|
13
13
|
import '@onereach/styles/tailwind.config.json';
|
|
14
|
-
import '../../OrButton-3a743a90.js';
|
|
15
|
-
import '../../OrButton.vue_rollup-plugin-vue_script-e8900483.js';
|
|
16
|
-
import '../../OrLoader-4ac49224.js';
|
|
17
|
-
import '../../normalize-component-6e8e3d80.js';
|
|
18
14
|
import '../../OrIconButton-234b9ac1.js';
|
|
19
15
|
import '../../OrIcon-0a14dafc.js';
|
|
16
|
+
import '../../normalize-component-6e8e3d80.js';
|
|
20
17
|
import '../../OrTooltip-6c7bcee4.js';
|
|
21
18
|
import '../../usePopoverState-5f2cd96f.js';
|
|
22
19
|
import '../../OrPopover-804594d0.js';
|
|
@@ -3,10 +3,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
3
3
|
rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
4
4
|
contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
5
5
|
}> & import("@vue/composition-api").Data, {}, {}, {
|
|
6
|
-
draggable: {
|
|
7
|
-
type: BooleanConstructor;
|
|
8
|
-
default: boolean;
|
|
9
|
-
};
|
|
10
6
|
selected: {
|
|
11
7
|
type: BooleanConstructor;
|
|
12
8
|
default: boolean;
|
|
@@ -15,11 +11,11 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
15
11
|
type: BooleanConstructor;
|
|
16
12
|
default: boolean;
|
|
17
13
|
};
|
|
18
|
-
}, import("@vue/composition-api").ExtractPropTypes<{
|
|
19
14
|
draggable: {
|
|
20
15
|
type: BooleanConstructor;
|
|
21
16
|
default: boolean;
|
|
22
17
|
};
|
|
18
|
+
}, import("@vue/composition-api").ExtractPropTypes<{
|
|
23
19
|
selected: {
|
|
24
20
|
type: BooleanConstructor;
|
|
25
21
|
default: boolean;
|
|
@@ -28,21 +24,25 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
28
24
|
type: BooleanConstructor;
|
|
29
25
|
default: boolean;
|
|
30
26
|
};
|
|
27
|
+
draggable: {
|
|
28
|
+
type: BooleanConstructor;
|
|
29
|
+
default: boolean;
|
|
30
|
+
};
|
|
31
31
|
}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
|
|
32
|
-
draggable: boolean;
|
|
33
32
|
selected: boolean;
|
|
34
33
|
disabled: boolean;
|
|
34
|
+
draggable: boolean;
|
|
35
35
|
} & {}, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
36
36
|
root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
37
37
|
rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
38
38
|
contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
|
|
39
39
|
}>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
|
|
40
|
-
draggable: boolean;
|
|
41
40
|
selected: boolean;
|
|
42
41
|
disabled: boolean;
|
|
43
|
-
} & {}, {
|
|
44
42
|
draggable: boolean;
|
|
43
|
+
} & {}, {
|
|
45
44
|
selected: boolean;
|
|
46
45
|
disabled: boolean;
|
|
46
|
+
draggable: boolean;
|
|
47
47
|
}, true>);
|
|
48
48
|
export default _default;
|
|
@@ -53,7 +53,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
53
53
|
close: () => void;
|
|
54
54
|
open: () => void;
|
|
55
55
|
selectOption: (item: SelectItem) => void;
|
|
56
|
-
deselectOption: (
|
|
56
|
+
deselectOption: (value: SelectItem['value']) => void;
|
|
57
57
|
toggleOption: (item: SelectItem) => void;
|
|
58
58
|
isDesktop: import("@vue/composition-api").ComputedRef<boolean>;
|
|
59
59
|
isMobile: import("@vue/composition-api").ComputedRef<boolean>;
|
|
@@ -283,7 +283,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
283
283
|
close: () => void;
|
|
284
284
|
open: () => void;
|
|
285
285
|
selectOption: (item: SelectItem) => void;
|
|
286
|
-
deselectOption: (
|
|
286
|
+
deselectOption: (value: SelectItem['value']) => void;
|
|
287
287
|
toggleOption: (item: SelectItem) => void;
|
|
288
288
|
isDesktop: import("@vue/composition-api").ComputedRef<boolean>;
|
|
289
289
|
isMobile: import("@vue/composition-api").ComputedRef<boolean>;
|
package/dist/esm/v2/index.js
CHANGED
|
@@ -76,8 +76,8 @@ export { L as LabelVariant, _ as OrLabelV3 } from './OrLabel-bf7e2ea2.js';
|
|
|
76
76
|
export { L as LinkColor, _ as OrLinkV3 } from './OrLink-30283089.js';
|
|
77
77
|
export { _ as OrList } from './OrList-24c2dc67.js';
|
|
78
78
|
export { _ as OrListOfInputs } from './OrListOfInputs-8fe8a224.js';
|
|
79
|
-
export { _ as OrListV3 } from './OrList-
|
|
80
|
-
export { _ as OrListItem } from './OrListItem-
|
|
79
|
+
export { _ as OrListV3 } from './OrList-d372b256.js';
|
|
80
|
+
export { _ as OrListItem } from './OrListItem-1b4b8db3.js';
|
|
81
81
|
export { L as LoaderViews, _ as OrLoader } from './OrLoader-84230be7.js';
|
|
82
82
|
export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, _ as OrLoaderV3 } from './OrLoader-4ac49224.js';
|
|
83
83
|
export { _ as OrMenuItemV3 } from './OrMenuItem-2e7a2e32.js';
|
|
@@ -109,7 +109,7 @@ export { _ as OrSearch } from './OrSearch-3f55fbee.js';
|
|
|
109
109
|
export { _ as OrSearchV3 } from './OrSearch-95314362.js';
|
|
110
110
|
export { _ as OrSegmentedControlV3, S as SegmentedControlSize } from './OrSegmentedControl-db974b3b.js';
|
|
111
111
|
export { _ as OrSelect } from './OrSelect-629c42c0.js';
|
|
112
|
-
export { _ as OrSelectV3 } from './OrSelect-
|
|
112
|
+
export { _ as OrSelectV3 } from './OrSelect-0a307d1f.js';
|
|
113
113
|
export { _ as OrSidebar, O as OrSidebarSide } from './OrSidebar-054b26c6.js';
|
|
114
114
|
export { _ as OrSidebarV3, S as SidebarPlacement } from './props-6bf01263.js';
|
|
115
115
|
export { _ as OrSkeletonCircle } from './OrSkeletonCircle-c4bf0e34.js';
|
|
@@ -7,30 +7,24 @@ import '@vueuse/core';
|
|
|
7
7
|
import { u as useProxyModelValue } from './useProxyModelValue-940010d2.js';
|
|
8
8
|
import '@onereach/styles/screens.json';
|
|
9
9
|
import '@onereach/styles/tailwind.config.json';
|
|
10
|
-
import { s as script$1 } from './
|
|
11
|
-
import { s as script$
|
|
12
|
-
import { s as script$
|
|
13
|
-
import {
|
|
14
|
-
import { s as script$5 } from './OrListItem-12fa8abd.js';
|
|
15
|
-
import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, createCommentVNode, createElementVNode, Fragment, renderList, createBlock, normalizeProps, guardReactiveProps } from 'vue';
|
|
10
|
+
import { s as script$1 } from './OrIconButton-cf4f2cba.js';
|
|
11
|
+
import { s as script$2 } from './OrLabel-4abbce6e.js';
|
|
12
|
+
import { s as script$3 } from './OrListItem-63389e98.js';
|
|
13
|
+
import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, createVNode, withCtx, createTextVNode, toDisplayString, createElementVNode, Fragment, renderList, createBlock, createCommentVNode } from 'vue';
|
|
16
14
|
|
|
17
15
|
const List = [
|
|
18
16
|
// Layout
|
|
19
17
|
'layout-column',
|
|
20
18
|
// Spacing
|
|
21
19
|
'gap-md'];
|
|
22
|
-
const ListHeader = [];
|
|
23
20
|
const ListContent = [];
|
|
24
|
-
const ListFooter = [];
|
|
25
21
|
|
|
26
22
|
var script = defineComponent({
|
|
27
23
|
name: 'OrList',
|
|
28
24
|
components: {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
OrLabel: script$4,
|
|
33
|
-
OrListItem: script$5
|
|
25
|
+
OrIconButton: script$1,
|
|
26
|
+
OrLabel: script$2,
|
|
27
|
+
OrListItem: script$3
|
|
34
28
|
},
|
|
35
29
|
model: {
|
|
36
30
|
prop: 'modelValue',
|
|
@@ -53,9 +47,9 @@ var script = defineComponent({
|
|
|
53
47
|
type: String,
|
|
54
48
|
default: undefined
|
|
55
49
|
},
|
|
56
|
-
|
|
57
|
-
type:
|
|
58
|
-
default:
|
|
50
|
+
disabled: {
|
|
51
|
+
type: Boolean,
|
|
52
|
+
default: false
|
|
59
53
|
},
|
|
60
54
|
canAdd: {
|
|
61
55
|
type: Boolean,
|
|
@@ -68,24 +62,19 @@ var script = defineComponent({
|
|
|
68
62
|
canReorder: {
|
|
69
63
|
type: Boolean,
|
|
70
64
|
default: true
|
|
71
|
-
},
|
|
72
|
-
disabled: {
|
|
73
|
-
type: Boolean,
|
|
74
|
-
default: false
|
|
75
65
|
}
|
|
76
66
|
},
|
|
77
67
|
emits: ['update:modelValue', 'before:add', 'before:delete', 'before:reorder', 'add', 'delete', 'reorder'],
|
|
78
68
|
expose: ['root'],
|
|
79
69
|
setup(props, context) {
|
|
80
|
-
// Refs
|
|
70
|
+
// Refs
|
|
81
71
|
const root = ref();
|
|
82
|
-
const rootStyles = computed(() => ['or-list-v3', ...List]);
|
|
83
|
-
const headerStyles = computed(() => [...ListHeader]);
|
|
84
72
|
const content = ref();
|
|
73
|
+
// Styles
|
|
74
|
+
const rootStyles = computed(() => ['or-list-v3', ...List]);
|
|
85
75
|
const contentStyles = computed(() => [...ListContent]);
|
|
86
|
-
const footerStyles = computed(() => [...ListFooter]);
|
|
87
76
|
// State
|
|
88
|
-
const
|
|
77
|
+
const proxyModelValue = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
|
|
89
78
|
// Effects
|
|
90
79
|
// #region Sortable
|
|
91
80
|
let sortable;
|
|
@@ -97,11 +86,11 @@ var script = defineComponent({
|
|
|
97
86
|
sortable = Sortable.create(content, {
|
|
98
87
|
disabled: props.disabled,
|
|
99
88
|
onUpdate: event => {
|
|
100
|
-
context.emit('before:reorder',
|
|
101
|
-
const nextModelValue = [...
|
|
89
|
+
context.emit('before:reorder', proxyModelValue.value);
|
|
90
|
+
const nextModelValue = [...proxyModelValue.value];
|
|
102
91
|
const reorderedItem = nextModelValue.splice(event.oldIndex, 1)[0];
|
|
103
92
|
nextModelValue.splice(event.newIndex, 0, reorderedItem);
|
|
104
|
-
context.emit('reorder', reorderedItem, event.newIndex, event.oldIndex,
|
|
93
|
+
context.emit('reorder', reorderedItem, event.newIndex, event.oldIndex, proxyModelValue.value = nextModelValue);
|
|
105
94
|
}
|
|
106
95
|
});
|
|
107
96
|
}
|
|
@@ -112,27 +101,50 @@ var script = defineComponent({
|
|
|
112
101
|
// #endregion
|
|
113
102
|
// Methods
|
|
114
103
|
function addItem() {
|
|
115
|
-
context.emit('before:add',
|
|
104
|
+
context.emit('before:add', proxyModelValue.value);
|
|
116
105
|
const addedItem = props.itemFactory();
|
|
117
|
-
const nextModelValue = [...
|
|
118
|
-
context.emit('add', addedItem, nextModelValue.indexOf(addedItem),
|
|
106
|
+
const nextModelValue = [...proxyModelValue.value, addedItem];
|
|
107
|
+
context.emit('add', addedItem, nextModelValue.indexOf(addedItem), proxyModelValue.value = nextModelValue);
|
|
119
108
|
}
|
|
120
109
|
function deleteItem(index) {
|
|
121
|
-
context.emit('before:delete',
|
|
122
|
-
const deletedItem =
|
|
123
|
-
const nextModelValue =
|
|
124
|
-
context.emit('delete', deletedItem, index,
|
|
110
|
+
context.emit('before:delete', proxyModelValue.value);
|
|
111
|
+
const deletedItem = proxyModelValue.value[index];
|
|
112
|
+
const nextModelValue = proxyModelValue.value.filter(item => item !== deletedItem);
|
|
113
|
+
context.emit('delete', deletedItem, index, proxyModelValue.value = nextModelValue);
|
|
125
114
|
}
|
|
115
|
+
// Handlers
|
|
116
|
+
// function onDragStart(event: DragEvent): void {
|
|
117
|
+
// console.log('dragstart', event);
|
|
118
|
+
// }
|
|
119
|
+
// function onDragEnter(event: DragEvent): void {
|
|
120
|
+
// console.log('dragenter', event);
|
|
121
|
+
// }
|
|
122
|
+
// function onDragOver(event: DragEvent): void {
|
|
123
|
+
// console.log('dragover', event);
|
|
124
|
+
// }
|
|
125
|
+
// function onDragLeave(event: DragEvent): void {
|
|
126
|
+
// console.log('dragleave', event);
|
|
127
|
+
// }
|
|
128
|
+
// function onDragEnd(event: DragEvent): void {
|
|
129
|
+
// console.log('dragend', event);
|
|
130
|
+
// }
|
|
131
|
+
// function onDrop(event: DragEvent): void {
|
|
132
|
+
// console.log('drop', event);
|
|
133
|
+
// }
|
|
126
134
|
return {
|
|
127
135
|
root,
|
|
128
|
-
rootStyles,
|
|
129
|
-
headerStyles,
|
|
130
136
|
content,
|
|
137
|
+
rootStyles,
|
|
131
138
|
contentStyles,
|
|
132
|
-
|
|
133
|
-
model,
|
|
139
|
+
proxyModelValue,
|
|
134
140
|
addItem,
|
|
135
141
|
deleteItem,
|
|
142
|
+
// onDragStart,
|
|
143
|
+
// onDragEnter,
|
|
144
|
+
// onDragOver,
|
|
145
|
+
// onDragLeave,
|
|
146
|
+
// onDragEnd,
|
|
147
|
+
// onDrop,
|
|
136
148
|
uuid: v4
|
|
137
149
|
};
|
|
138
150
|
}
|
|
@@ -146,39 +158,34 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
146
158
|
const _component_OrLabel = resolveComponent("OrLabel");
|
|
147
159
|
const _component_OrIconButton = resolveComponent("OrIconButton");
|
|
148
160
|
const _component_OrListItem = resolveComponent("OrListItem");
|
|
149
|
-
const _component_OrIcon = resolveComponent("OrIcon");
|
|
150
|
-
const _component_OrButton = resolveComponent("OrButton");
|
|
151
161
|
return openBlock(), createElementBlock("div", {
|
|
152
162
|
ref: 'root',
|
|
153
163
|
class: normalizeClass(_ctx.rootStyles),
|
|
154
164
|
disabled: _ctx.disabled
|
|
155
|
-
}, [_ctx.$slots
|
|
156
|
-
key: 0,
|
|
157
|
-
class: normalizeClass(_ctx.headerStyles)
|
|
158
|
-
}, [renderSlot(_ctx.$slots, "header", {
|
|
165
|
+
}, [renderSlot(_ctx.$slots, "header", normalizeProps(guardReactiveProps({
|
|
159
166
|
addItem: _ctx.addItem,
|
|
160
167
|
deleteItem: _ctx.deleteItem
|
|
161
|
-
}, () => [createVNode(_component_OrLabel, {
|
|
168
|
+
})), () => [createVNode(_component_OrLabel, {
|
|
162
169
|
disabled: _ctx.disabled
|
|
163
170
|
}, {
|
|
164
171
|
addon: withCtx(() => [renderSlot(_ctx.$slots, "label-addon")]),
|
|
165
172
|
default: withCtx(() => [renderSlot(_ctx.$slots, "label", {}, () => [createTextVNode(toDisplayString(_ctx.label), 1 /* TEXT */)])]),
|
|
166
173
|
|
|
167
174
|
_: 3 /* FORWARDED */
|
|
168
|
-
}, 8 /* PROPS */, ["disabled"])])
|
|
175
|
+
}, 8 /* PROPS */, ["disabled"])]), createElementVNode("div", {
|
|
169
176
|
ref: 'content',
|
|
170
177
|
class: normalizeClass(_ctx.contentStyles)
|
|
171
|
-
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.
|
|
178
|
+
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.proxyModelValue, (item, index) => {
|
|
172
179
|
return openBlock(), createBlock(_component_OrListItem, {
|
|
173
180
|
key: item.key || _ctx.uuid(),
|
|
174
|
-
draggable: _ctx.canReorder,
|
|
175
181
|
selected: _ctx.selection.includes(item),
|
|
176
|
-
disabled: _ctx.disabled
|
|
182
|
+
disabled: _ctx.disabled,
|
|
183
|
+
draggable: _ctx.canReorder
|
|
177
184
|
}, {
|
|
178
185
|
default: withCtx(() => [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
|
|
179
186
|
item,
|
|
180
187
|
index,
|
|
181
|
-
items: _ctx.
|
|
188
|
+
items: _ctx.proxyModelValue,
|
|
182
189
|
addItem: _ctx.addItem,
|
|
183
190
|
deleteItem: _ctx.deleteItem
|
|
184
191
|
})), () => [createTextVNode(toDisplayString(item), 1 /* TEXT */)])]), _ctx.canDelete ? (openBlock(), createBlock(_component_OrIconButton, {
|
|
@@ -188,25 +195,16 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
188
195
|
onClick: $event => _ctx.deleteItem(index)
|
|
189
196
|
}, null, 8 /* PROPS */, ["disabled", "onClick"])) : createCommentVNode("v-if", true)]),
|
|
190
197
|
_: 2 /* DYNAMIC */
|
|
191
|
-
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["
|
|
192
|
-
}), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */), _ctx.$slots
|
|
193
|
-
key: 1,
|
|
194
|
-
class: normalizeClass(_ctx.footerStyles)
|
|
195
|
-
}, [renderSlot(_ctx.$slots, "footer", {
|
|
198
|
+
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["selected", "disabled", "draggable"]);
|
|
199
|
+
}), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */), renderSlot(_ctx.$slots, "footer", normalizeProps(guardReactiveProps({
|
|
196
200
|
addItem: _ctx.addItem,
|
|
197
201
|
deleteItem: _ctx.deleteItem
|
|
198
|
-
}, () => [_ctx.canAdd ? (openBlock(), createBlock(
|
|
202
|
+
})), () => [_ctx.canAdd ? (openBlock(), createBlock(_component_OrIconButton, {
|
|
199
203
|
key: 0,
|
|
200
|
-
|
|
204
|
+
icon: 'add',
|
|
201
205
|
disabled: _ctx.disabled,
|
|
202
206
|
onClick: _cache[0] || (_cache[0] = $event => _ctx.addItem())
|
|
203
|
-
},
|
|
204
|
-
default: withCtx(() => [renderSlot(_ctx.$slots, "add-button", {}, () => [createVNode(_component_OrIcon, {
|
|
205
|
-
icon: 'add'
|
|
206
|
-
}), createTextVNode(" " + toDisplayString(_ctx.addButtonLabel), 1 /* TEXT */)])]),
|
|
207
|
-
|
|
208
|
-
_: 3 /* FORWARDED */
|
|
209
|
-
}, 8 /* PROPS */, ["disabled"])) : createCommentVNode("v-if", true)])], 2 /* CLASS */)) : createCommentVNode("v-if", true)], 10 /* CLASS, PROPS */, _hoisted_1);
|
|
207
|
+
}, null, 8 /* PROPS */, ["disabled"])) : createCommentVNode("v-if", true)])], 10 /* CLASS, PROPS */, _hoisted_1);
|
|
210
208
|
}
|
|
211
209
|
|
|
212
210
|
script.render = render;
|
|
@@ -23,22 +23,23 @@ const ListItemContent = [
|
|
|
23
23
|
var script = defineComponent({
|
|
24
24
|
name: 'OrListItem',
|
|
25
25
|
props: {
|
|
26
|
-
|
|
26
|
+
selected: {
|
|
27
27
|
type: Boolean,
|
|
28
28
|
default: false
|
|
29
29
|
},
|
|
30
|
-
|
|
30
|
+
disabled: {
|
|
31
31
|
type: Boolean,
|
|
32
32
|
default: false
|
|
33
33
|
},
|
|
34
|
-
|
|
34
|
+
draggable: {
|
|
35
35
|
type: Boolean,
|
|
36
36
|
default: false
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
39
|
setup() {
|
|
40
|
-
// Refs
|
|
40
|
+
// Refs
|
|
41
41
|
const root = ref();
|
|
42
|
+
// Styles
|
|
42
43
|
const rootStyles = computed(() => ['or-list-item-v3', ...ListItem]);
|
|
43
44
|
const contentStyles = computed(() => [...ListItemContent]);
|
|
44
45
|
return {
|
|
@@ -321,9 +321,9 @@ var script = defineComponent({
|
|
|
321
321
|
proxyModelValue.value = item.value;
|
|
322
322
|
}
|
|
323
323
|
}
|
|
324
|
-
function deselectOption(
|
|
324
|
+
function deselectOption(value) {
|
|
325
325
|
if (props.multiple) {
|
|
326
|
-
proxyModelValue.value = exclude(
|
|
326
|
+
proxyModelValue.value = exclude(value, toArray(proxyModelValue.value));
|
|
327
327
|
} else {
|
|
328
328
|
proxyModelValue.value = undefined;
|
|
329
329
|
}
|
|
@@ -337,7 +337,11 @@ var script = defineComponent({
|
|
|
337
337
|
proxyModelValue.value = exclude(item.value, model);
|
|
338
338
|
}
|
|
339
339
|
} else {
|
|
340
|
-
|
|
340
|
+
if (props.enableClear) {
|
|
341
|
+
proxyModelValue.value = proxyModelValue.value !== item.value ? item.value : undefined;
|
|
342
|
+
} else {
|
|
343
|
+
proxyModelValue.value = item.value;
|
|
344
|
+
}
|
|
341
345
|
}
|
|
342
346
|
searchText.value = '';
|
|
343
347
|
}
|
|
@@ -73,8 +73,8 @@ export { L as LabelVariant, s as OrLabelV3 } from '../OrLabel-4abbce6e.js';
|
|
|
73
73
|
export { L as LinkColor, s as OrLinkV3 } from '../OrLink-c83a51b2.js';
|
|
74
74
|
export { s as OrList } from '../OrList-1625c863.js';
|
|
75
75
|
export { s as OrListOfInputs } from '../OrListOfInputs-690c57bc.js';
|
|
76
|
-
export { s as OrListV3 } from '../OrList-
|
|
77
|
-
export { s as OrListItem } from '../OrListItem-
|
|
76
|
+
export { s as OrListV3 } from '../OrList-7897e5c3.js';
|
|
77
|
+
export { s as OrListItem } from '../OrListItem-63389e98.js';
|
|
78
78
|
export { L as LoaderViews, s as OrLoader } from '../OrLoader-d5a5b426.js';
|
|
79
79
|
export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, s as OrLoaderV3 } from '../OrLoader-5e2f359b.js';
|
|
80
80
|
export { s as OrMenuItemV3 } from '../OrMenuItem-1f52a938.js';
|
|
@@ -106,7 +106,7 @@ export { s as OrSearch } from '../OrSearch-740f931b.js';
|
|
|
106
106
|
export { s as OrSearchV3 } from '../OrSearch-f8cd6609.js';
|
|
107
107
|
export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl-d81008ce.js';
|
|
108
108
|
export { s as OrSelect } from '../OrSelect-96f3a5ff.js';
|
|
109
|
-
export { s as OrSelectV3 } from '../OrSelect-
|
|
109
|
+
export { s as OrSelectV3 } from '../OrSelect-fa01e6e5.js';
|
|
110
110
|
export { s as OrSidebar, O as OrSidebarSide } from '../OrSidebar-4ab42b93.js';
|
|
111
111
|
export { s as OrSidebarV3, S as SidebarPlacement } from '../props-12beda9e.js';
|
|
112
112
|
export { s as OrSkeletonCircle } from '../OrSkeletonCircle-66e175a0.js';
|
|
@@ -17,9 +17,9 @@ declare const _default: import("vue-demi").DefineComponent<{
|
|
|
17
17
|
type: StringConstructor;
|
|
18
18
|
default: undefined;
|
|
19
19
|
};
|
|
20
|
-
|
|
21
|
-
type:
|
|
22
|
-
default:
|
|
20
|
+
disabled: {
|
|
21
|
+
type: BooleanConstructor;
|
|
22
|
+
default: boolean;
|
|
23
23
|
};
|
|
24
24
|
canAdd: {
|
|
25
25
|
type: BooleanConstructor;
|
|
@@ -33,18 +33,12 @@ declare const _default: import("vue-demi").DefineComponent<{
|
|
|
33
33
|
type: BooleanConstructor;
|
|
34
34
|
default: boolean;
|
|
35
35
|
};
|
|
36
|
-
disabled: {
|
|
37
|
-
type: BooleanConstructor;
|
|
38
|
-
default: boolean;
|
|
39
|
-
};
|
|
40
36
|
}, {
|
|
41
37
|
root: import("vue-demi").Ref<HTMLElement | undefined>;
|
|
42
|
-
rootStyles: import("vue-demi").ComputedRef<string[]>;
|
|
43
|
-
headerStyles: import("vue-demi").ComputedRef<string[]>;
|
|
44
38
|
content: import("vue-demi").Ref<HTMLElement | undefined>;
|
|
39
|
+
rootStyles: import("vue-demi").ComputedRef<string[]>;
|
|
45
40
|
contentStyles: import("vue-demi").ComputedRef<string[]>;
|
|
46
|
-
|
|
47
|
-
model: import("../../hooks").UseProxyModelValueReturn<ListItem[]>;
|
|
41
|
+
proxyModelValue: import("../../hooks").UseProxyModelValueReturn<ListItem[]>;
|
|
48
42
|
addItem: () => void;
|
|
49
43
|
deleteItem: (index: number) => void;
|
|
50
44
|
uuid: (<T extends ArrayLike<number>>(options: import("uuid").V4Options | null | undefined, buffer: T, offset?: number | undefined) => T) & ((options?: import("uuid").V4Options | undefined) => string);
|
|
@@ -65,9 +59,9 @@ declare const _default: import("vue-demi").DefineComponent<{
|
|
|
65
59
|
type: StringConstructor;
|
|
66
60
|
default: undefined;
|
|
67
61
|
};
|
|
68
|
-
|
|
69
|
-
type:
|
|
70
|
-
default:
|
|
62
|
+
disabled: {
|
|
63
|
+
type: BooleanConstructor;
|
|
64
|
+
default: boolean;
|
|
71
65
|
};
|
|
72
66
|
canAdd: {
|
|
73
67
|
type: BooleanConstructor;
|
|
@@ -81,10 +75,6 @@ declare const _default: import("vue-demi").DefineComponent<{
|
|
|
81
75
|
type: BooleanConstructor;
|
|
82
76
|
default: boolean;
|
|
83
77
|
};
|
|
84
|
-
disabled: {
|
|
85
|
-
type: BooleanConstructor;
|
|
86
|
-
default: boolean;
|
|
87
|
-
};
|
|
88
78
|
}>> & {
|
|
89
79
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
90
80
|
"onBefore:add"?: ((...args: any[]) => any) | undefined;
|
|
@@ -98,10 +88,9 @@ declare const _default: import("vue-demi").DefineComponent<{
|
|
|
98
88
|
selection: ListItem[];
|
|
99
89
|
itemFactory: () => ListItem;
|
|
100
90
|
label: string;
|
|
101
|
-
|
|
91
|
+
disabled: boolean;
|
|
102
92
|
canAdd: boolean;
|
|
103
93
|
canDelete: boolean;
|
|
104
94
|
canReorder: boolean;
|
|
105
|
-
disabled: boolean;
|
|
106
95
|
}>;
|
|
107
96
|
export default _default;
|