@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.
Files changed (52) hide show
  1. package/dist/bundled/v2/{OrList-ec3bc502.js → OrList-a1877407.js} +71 -66
  2. package/dist/bundled/v2/components/OrListV3/OrList.js +1 -1
  3. package/dist/bundled/v2/components/OrListV3/OrList.vue.d.ts +13 -28
  4. package/dist/bundled/v2/components/OrListV3/index.js +1 -1
  5. package/dist/bundled/v2/components/OrListV3/styles.d.ts +0 -2
  6. package/dist/bundled/v2/components/OrListV3/styles.js +1 -3
  7. package/dist/bundled/v2/components/OrSelectV3/OrSelect.js +7 -3
  8. package/dist/bundled/v2/components/OrSelectV3/OrSelect.vue.d.ts +2 -2
  9. package/dist/bundled/v2/components/index.js +1 -1
  10. package/dist/bundled/v2/index.js +1 -1
  11. package/dist/bundled/v3/components/OrListV3/OrList.js +1 -1
  12. package/dist/bundled/v3/components/OrListV3/OrList.vue.d.ts +9 -20
  13. package/dist/bundled/v3/components/OrListV3/index.js +1 -1
  14. package/dist/bundled/v3/components/OrListV3/styles.d.ts +0 -2
  15. package/dist/bundled/v3/components/OrListV3/styles.js +1 -1
  16. package/dist/bundled/v3/components/{OrListV3-fb0f71e8.js → OrListV3-08054afc.js} +67 -68
  17. package/dist/bundled/v3/components/OrSelectV3/OrSelect.js +1 -1
  18. package/dist/bundled/v3/components/OrSelectV3/OrSelect.vue.d.ts +1 -1
  19. package/dist/bundled/v3/components/OrSelectV3/index.js +1 -1
  20. package/dist/bundled/v3/components/OrSelectV3/styles.js +1 -1
  21. package/dist/bundled/v3/components/{OrSelectV3-c408277b.js → OrSelectV3-2f570a8e.js} +7 -3
  22. package/dist/bundled/v3/components/index.js +2 -2
  23. package/dist/bundled/v3/index.js +2 -2
  24. package/dist/esm/v2/{OrList-3192132a.js → OrList-d372b256.js} +67 -66
  25. package/dist/esm/v2/{OrListItem-82ea1e2b.js → OrListItem-1b4b8db3.js} +5 -4
  26. package/dist/esm/v2/{OrSelect-b9c733f5.js → OrSelect-0a307d1f.js} +7 -3
  27. package/dist/esm/v2/components/index.js +3 -3
  28. package/dist/esm/v2/components/or-list-v3/OrList.vue.d.ts +13 -28
  29. package/dist/esm/v2/components/or-list-v3/index.js +3 -6
  30. package/dist/esm/v2/components/or-list-v3/partials/index.js +1 -1
  31. package/dist/esm/v2/components/or-list-v3/partials/or-list-item/OrListItem.vue.d.ts +8 -8
  32. package/dist/esm/v2/components/or-list-v3/styles.d.ts +0 -2
  33. package/dist/esm/v2/components/or-select-v3/OrSelect.vue.d.ts +2 -2
  34. package/dist/esm/v2/components/or-select-v3/index.js +1 -1
  35. package/dist/esm/v2/index.js +3 -3
  36. package/dist/esm/v3/{OrList-769c6101.js → OrList-7897e5c3.js} +63 -65
  37. package/dist/esm/v3/{OrListItem-12fa8abd.js → OrListItem-63389e98.js} +5 -4
  38. package/dist/esm/v3/{OrSelect-a88e236a.js → OrSelect-fa01e6e5.js} +7 -3
  39. package/dist/esm/v3/components/index.js +3 -3
  40. package/dist/esm/v3/components/or-list-v3/OrList.vue.d.ts +9 -20
  41. package/dist/esm/v3/components/or-list-v3/index.js +3 -5
  42. package/dist/esm/v3/components/or-list-v3/partials/index.js +1 -1
  43. package/dist/esm/v3/components/or-list-v3/partials/or-list-item/OrListItem.vue.d.ts +7 -7
  44. package/dist/esm/v3/components/or-list-v3/styles.d.ts +0 -2
  45. package/dist/esm/v3/components/or-select-v3/OrSelect.vue.d.ts +1 -1
  46. package/dist/esm/v3/components/or-select-v3/index.js +1 -1
  47. package/dist/esm/v3/index.js +3 -3
  48. package/package.json +1 -1
  49. package/src/components/or-list-v3/OrList.vue +90 -86
  50. package/src/components/or-list-v3/partials/or-list-item/OrListItem.vue +5 -5
  51. package/src/components/or-list-v3/styles.ts +0 -4
  52. 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-3192132a.js';
80
- export { _ as OrListItem } from '../OrListItem-82ea1e2b.js';
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-b9c733f5.js';
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
- footerStyles: import("@vue/composition-api").ComputedRef<string[]>;
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
- addButtonLabel: {
32
- type: StringConstructor;
33
- default: string;
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
- addButtonLabel: {
69
- type: StringConstructor;
70
- default: string;
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
- addButtonLabel: string;
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
- footerStyles: import("@vue/composition-api").ComputedRef<string[]>;
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
- addButtonLabel: string;
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
- addButtonLabel: string;
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-3192132a.js';
2
- export { _ as OrListItem } from '../../OrListItem-82ea1e2b.js';
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';
@@ -1,3 +1,3 @@
1
- export { _ as OrListItem } from '../../../OrListItem-82ea1e2b.js';
1
+ export { _ as OrListItem } from '../../../OrListItem-1b4b8db3.js';
2
2
  import 'vue-demi';
3
3
  import '../../../normalize-component-6e8e3d80.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;
@@ -1,4 +1,2 @@
1
1
  export declare const List: string[];
2
- export declare const ListHeader: string[];
3
2
  export declare const ListContent: string[];
4
- export declare const ListFooter: string[];
@@ -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: (item: SelectItem) => void;
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: (item: SelectItem) => void;
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>;
@@ -1,4 +1,4 @@
1
- export { _ as OrSelectV3 } from '../../OrSelect-b9c733f5.js';
1
+ export { _ as OrSelectV3 } from '../../OrSelect-0a307d1f.js';
2
2
  import 'vue-demi';
3
3
  import '../../dropdown-open-06d651cf.js';
4
4
  import '../../include-2a81e823.js';
@@ -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-3192132a.js';
80
- export { _ as OrListItem } from './OrListItem-82ea1e2b.js';
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-b9c733f5.js';
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 './OrButton-31bcb511.js';
11
- import { s as script$3 } from './OrIconButton-cf4f2cba.js';
12
- import { s as script$2 } from './OrIcon-9aff520e.js';
13
- import { s as script$4 } from './OrLabel-4abbce6e.js';
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
- OrButton: script$1,
30
- OrIcon: script$2,
31
- OrIconButton: script$3,
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
- addButtonLabel: {
57
- type: String,
58
- default: 'Add Item'
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 & Styles
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 model = useProxyModelValue(toRef(props, 'modelValue'), context.emit);
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', model.value);
101
- const nextModelValue = [...model.value];
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, model.value = nextModelValue);
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', model.value);
104
+ context.emit('before:add', proxyModelValue.value);
116
105
  const addedItem = props.itemFactory();
117
- const nextModelValue = [...model.value, addedItem];
118
- context.emit('add', addedItem, nextModelValue.indexOf(addedItem), model.value = nextModelValue);
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', model.value);
122
- const deletedItem = model.value[index];
123
- const nextModelValue = model.value.filter(item => item !== deletedItem);
124
- context.emit('delete', deletedItem, index, model.value = nextModelValue);
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
- footerStyles,
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['header'] || _ctx.$slots['label'] || _ctx.$slots['label-addon'] || _ctx.label ? (openBlock(), createElementBlock("div", {
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"])])], 2 /* CLASS */)) : createCommentVNode("v-if", true), createElementVNode("div", {
175
+ }, 8 /* PROPS */, ["disabled"])]), createElementVNode("div", {
169
176
  ref: 'content',
170
177
  class: normalizeClass(_ctx.contentStyles)
171
- }, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.model, (item, index) => {
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.model,
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 */, ["draggable", "selected", "disabled"]);
192
- }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */), _ctx.$slots['footer'] || _ctx.canAdd ? (openBlock(), createElementBlock("div", {
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(_component_OrButton, {
202
+ })), () => [_ctx.canAdd ? (openBlock(), createBlock(_component_OrIconButton, {
199
203
  key: 0,
200
- variant: 'link',
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
- draggable: {
26
+ selected: {
27
27
  type: Boolean,
28
28
  default: false
29
29
  },
30
- selected: {
30
+ disabled: {
31
31
  type: Boolean,
32
32
  default: false
33
33
  },
34
- disabled: {
34
+ draggable: {
35
35
  type: Boolean,
36
36
  default: false
37
37
  }
38
38
  },
39
39
  setup() {
40
- // Refs & Styles
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(item) {
324
+ function deselectOption(value) {
325
325
  if (props.multiple) {
326
- proxyModelValue.value = exclude(item.value, toArray(proxyModelValue.value));
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
- proxyModelValue.value = proxyModelValue.value !== item.value ? item.value : undefined;
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-769c6101.js';
77
- export { s as OrListItem } from '../OrListItem-12fa8abd.js';
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-a88e236a.js';
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
- addButtonLabel: {
21
- type: StringConstructor;
22
- default: string;
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
- footerStyles: import("vue-demi").ComputedRef<string[]>;
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
- addButtonLabel: {
69
- type: StringConstructor;
70
- default: string;
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
- addButtonLabel: string;
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;