@onereach/ui-components 2.69.1-beta.2099.0 → 2.69.1-beta.2101.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 (85) hide show
  1. package/dist/bundled/v2/{OrAvatar-2fa559e1.js → OrAvatar-1ada4581.js} +7 -1
  2. package/dist/bundled/v2/{OrCard-29116e1f.js → OrCard-58a1ba3e.js} +2 -2
  3. package/dist/bundled/v2/OrCardCollection-a9a779ea.js +228 -0
  4. package/dist/bundled/v2/{OrSearch-a11b3621.js → OrSearch-9d402f56.js} +3 -9
  5. package/dist/bundled/v2/{OrSortHeader-9932d28f.js → OrSortHeader-396e6a7c.js} +2 -2
  6. package/dist/bundled/v2/components/index.js +5 -5
  7. package/dist/bundled/v2/components/or-avatar-v3/index.js +1 -1
  8. package/dist/bundled/v2/components/or-avatar-v3/props.d.ts +2 -1
  9. package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  10. package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollection.vue.d.ts +39 -65
  11. package/dist/bundled/v2/components/or-card-collection-v3/index.js +4 -7
  12. package/dist/bundled/v2/components/or-card-collection-v3/types.d.ts +3 -8
  13. package/dist/bundled/v2/components/or-card-v3/index.js +1 -1
  14. package/dist/bundled/v2/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  15. package/dist/bundled/v2/components/or-search-v3/index.js +1 -1
  16. package/dist/bundled/v2/components/or-sort-header-v3/index.js +1 -1
  17. package/dist/bundled/v2/index.js +6 -6
  18. package/dist/bundled/v3/{OrAvatar.vue_vue_type_script_lang-22e46ce1.js → OrAvatar.vue_vue_type_script_lang-a0a72134.js} +7 -1
  19. package/dist/bundled/v3/OrCardCollection.vue_vue_type_script_lang-3993a015.js +164 -0
  20. package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-85472b12.js → OrConfirm.vue_vue_type_script_lang-289b5600.js} +36 -6
  21. package/dist/bundled/v3/{OrSearch.vue_vue_type_script_lang-0ae8a6dd.js → OrSearch.vue_vue_type_script_lang-ed78b21f.js} +2 -8
  22. package/dist/bundled/v3/{OrTabs.vue_vue_type_script_lang-61b79a5a.js → OrTabs.vue_vue_type_script_lang-919b2021.js} +36 -10
  23. package/dist/bundled/v3/components/index.js +8 -10
  24. package/dist/bundled/v3/components/or-avatar-v3/index.js +1 -1
  25. package/dist/bundled/v3/components/or-avatar-v3/props.d.ts +2 -1
  26. package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  27. package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollection.vue.d.ts +39 -65
  28. package/dist/bundled/v3/components/or-card-collection-v3/index.js +4 -11
  29. package/dist/bundled/v3/components/or-card-collection-v3/types.d.ts +3 -8
  30. package/dist/bundled/v3/components/or-confirm-v3/index.js +1 -2
  31. package/dist/bundled/v3/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  32. package/dist/bundled/v3/components/or-search-v3/index.js +1 -1
  33. package/dist/bundled/v3/components/or-tabs-v3/index.js +1 -2
  34. package/dist/bundled/v3/index.js +298 -329
  35. package/dist/esm/v2/{OrAvatar-0afdef36.js → OrAvatar-95b029b4.js} +7 -1
  36. package/dist/esm/v2/OrCardCollection-4f001551.js +227 -0
  37. package/dist/esm/v2/{OrSearch-62d91301.js → OrSearch-ddb7c1fe.js} +1 -7
  38. package/dist/esm/v2/components/index.js +3 -3
  39. package/dist/esm/v2/components/or-avatar-v3/index.js +1 -1
  40. package/dist/esm/v2/components/or-avatar-v3/props.d.ts +2 -1
  41. package/dist/esm/v2/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  42. package/dist/esm/v2/components/or-card-collection-v3/OrCardCollection.vue.d.ts +39 -65
  43. package/dist/esm/v2/components/or-card-collection-v3/index.js +4 -7
  44. package/dist/esm/v2/components/or-card-collection-v3/types.d.ts +3 -8
  45. package/dist/esm/v2/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  46. package/dist/esm/v2/components/or-search-v3/index.js +1 -1
  47. package/dist/esm/v2/index.js +3 -3
  48. package/dist/esm/v3/{OrAvatar-ef88d31c.js → OrAvatar-9ed782da.js} +7 -1
  49. package/dist/esm/v3/OrCardCollection-5a0febaf.js +198 -0
  50. package/dist/esm/v3/{OrSearch-aafb93b4.js → OrSearch-cdde55ce.js} +1 -7
  51. package/dist/esm/v3/components/index.js +3 -3
  52. package/dist/esm/v3/components/or-avatar-v3/index.js +1 -1
  53. package/dist/esm/v3/components/or-avatar-v3/props.d.ts +2 -1
  54. package/dist/esm/v3/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  55. package/dist/esm/v3/components/or-card-collection-v3/OrCardCollection.vue.d.ts +39 -65
  56. package/dist/esm/v3/components/or-card-collection-v3/index.js +4 -7
  57. package/dist/esm/v3/components/or-card-collection-v3/types.d.ts +3 -8
  58. package/dist/esm/v3/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  59. package/dist/esm/v3/components/or-search-v3/index.js +1 -1
  60. package/dist/esm/v3/index.js +3 -3
  61. package/package.json +1 -1
  62. package/src/components/or-avatar-v3/props.ts +1 -0
  63. package/src/components/or-avatar-v3/styles.ts +9 -0
  64. package/src/components/or-card-collection-v3/OrCardCollection.stories3.ts +28 -229
  65. package/src/components/or-card-collection-v3/OrCardCollection.vue +76 -119
  66. package/src/components/or-card-collection-v3/styles.ts +1 -1
  67. package/src/components/or-card-collection-v3/types.ts +3 -9
  68. package/src/components/or-search-v3/OrSearch.vue +1 -7
  69. package/dist/bundled/v2/OrCardCollection-953657a7.js +0 -347
  70. package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollectionView.vue2.vue.d.ts +0 -35
  71. package/dist/bundled/v2/components/or-card-collection-v3/constatnts.d.ts +0 -4
  72. package/dist/bundled/v3/OrButton-8ab33d9d.js +0 -33
  73. package/dist/bundled/v3/OrCardCollection.vue_vue_type_script_lang-4debae8a.js +0 -229
  74. package/dist/bundled/v3/OrMenu-f26e8e55.js +0 -29
  75. package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollectionView.vue3.vue.d.ts +0 -35
  76. package/dist/bundled/v3/components/or-card-collection-v3/constatnts.d.ts +0 -4
  77. package/dist/esm/v2/OrCardCollection-55e282a7.js +0 -347
  78. package/dist/esm/v2/components/or-card-collection-v3/OrCardCollectionView.vue2.vue.d.ts +0 -35
  79. package/dist/esm/v2/components/or-card-collection-v3/constatnts.d.ts +0 -4
  80. package/dist/esm/v3/OrCardCollection-0c6da4b8.js +0 -290
  81. package/dist/esm/v3/components/or-card-collection-v3/OrCardCollectionView.vue3.vue.d.ts +0 -35
  82. package/dist/esm/v3/components/or-card-collection-v3/constatnts.d.ts +0 -4
  83. package/src/components/or-card-collection-v3/OrCardCollectionView.vue2.vue +0 -41
  84. package/src/components/or-card-collection-v3/OrCardCollectionView.vue3.vue +0 -42
  85. package/src/components/or-card-collection-v3/constatnts.ts +0 -12
@@ -1,347 +0,0 @@
1
- import './index-fa6eb4ca.js';
2
- import { defineComponent, computed, ref, watch } from '@vue/composition-api/dist/vue-composition-api.mjs';
3
- import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
4
- import { O as OrIconButton } from './OrIconButton-a215104c.js';
5
- import { O as OrButton } from './OrButton-0e91a808.js';
6
- import { O as OrMenu } from './OrMenu-fa47c888.js';
7
- import { O as OrMenuItem } from './OrMenuItem-26420908.js';
8
- import { O as OrIcon } from './OrIcon-8625385f.js';
9
- import { O as OrSearch } from './OrSearch-a11b3621.js';
10
- import { u as useClassAttribute } from './useClassAttribute-9bf33346.js';
11
-
12
- var CardCollectionView;
13
- (function (CardCollectionView) {
14
- CardCollectionView["Grid"] = "grid";
15
- CardCollectionView["List"] = "list";
16
- })(CardCollectionView || (CardCollectionView = {}));
17
-
18
- const CardCollectionRoot = [
19
- // Layout
20
- 'layout-column',
21
- // Spacing
22
- 'gap-md'];
23
- const CardCollectionToolbar = [
24
- // Layout
25
- 'layout-row justify-between',
26
- // Typography
27
- 'typography-body-2-regular',
28
- // Theme
29
- 'theme-foreground-default', 'dark:theme-foreground-default-dark'];
30
- const CardCollectionToolbarPanel = [
31
- // Layout
32
- 'layout-row',
33
- // Spacing
34
- 'gap-lg+'];
35
- const CardCollectionContent = [
36
- // Layout
37
- 'grid',
38
- // Spacing
39
- 'gap-sm md:gap-md'];
40
- const CardCollectionContentViews = {
41
- 'grid': [
42
- // Layout
43
- 'sm:grid-cols-1', 'md:grid-cols-2', 'lg:grid-cols-4', 'xl:grid-cols-6'],
44
- 'list': []
45
- };
46
-
47
- var script$1 = defineComponent({
48
- name: 'OrCardCollectionView',
49
- props: {
50
- items: {
51
- type: Array,
52
- default: []
53
- },
54
- mode: {
55
- type: String,
56
- required: true
57
- }
58
- },
59
- setup(props) {
60
- const contentStyles = computed(() => [...CardCollectionContent, ...CardCollectionContentViews[props.mode]]);
61
- return {
62
- contentStyles
63
- };
64
- }
65
- });
66
-
67
- /* script */
68
- const __vue_script__$1 = script$1;
69
-
70
- /* template */
71
- var __vue_render__$1 = function () {
72
- var _vm = this;
73
- var _h = _vm.$createElement;
74
- var _c = _vm._self._c || _h;
75
- return _c('div', {
76
- class: _vm.contentStyles
77
- }, [_vm._l(_vm.items, function (item) {
78
- return _vm._t("item", function () {
79
- return [_vm._v("\n " + _vm._s(item.key) + "\n ")];
80
- }, null, {
81
- item: item,
82
- mode: _vm.mode
83
- });
84
- })], 2);
85
- };
86
- var __vue_staticRenderFns__$1 = [];
87
-
88
- /* style */
89
- const __vue_inject_styles__$1 = undefined;
90
- /* scoped */
91
- const __vue_scope_id__$1 = undefined;
92
- /* module identifier */
93
- const __vue_module_identifier__$1 = undefined;
94
- /* functional template */
95
- const __vue_is_functional_template__$1 = false;
96
- /* style inject */
97
-
98
- /* style inject SSR */
99
-
100
- /* style inject shadow dom */
101
-
102
- const __vue_component__$2 = /*#__PURE__*/normalizeComponent({
103
- render: __vue_render__$1,
104
- staticRenderFns: __vue_staticRenderFns__$1
105
- }, __vue_inject_styles__$1, __vue_script__$1, __vue_scope_id__$1, __vue_is_functional_template__$1, __vue_module_identifier__$1, false, undefined, undefined, undefined);
106
- var OrCardCollectionView = __vue_component__$2;
107
-
108
- const gridView = {
109
- view: 'grid',
110
- icon: 'grid_view'
111
- };
112
- const listView = {
113
- view: 'list',
114
- icon: 'view_agenda'
115
- };
116
- const defaultViewModes = [gridView, listView];
117
-
118
- var script = defineComponent({
119
- name: 'OrCardCollection',
120
- components: {
121
- OrCardCollectionView,
122
- OrIconButton,
123
- OrButton,
124
- OrMenu,
125
- OrMenuItem,
126
- OrIcon,
127
- OrSearch
128
- },
129
- inheritAttrs: false,
130
- props: {
131
- items: {
132
- type: Array,
133
- default: []
134
- },
135
- view: {
136
- type: String,
137
- default: CardCollectionView.Grid
138
- },
139
- viewModes: {
140
- type: Array,
141
- default: () => defaultViewModes
142
- },
143
- sort: {
144
- type: String,
145
- default: undefined
146
- },
147
- sortOptions: {
148
- type: Array,
149
- default: () => []
150
- },
151
- search: {
152
- type: String,
153
- default: ''
154
- }
155
- },
156
- emits: ['viewChange', 'sortChange', 'searchChange'],
157
- expose: ['root'],
158
- setup(props, context) {
159
- // Refs
160
- const root = ref();
161
- const sortMenu = ref();
162
- const sortButton = ref();
163
- // Styles
164
- const classAttribute = useClassAttribute();
165
- const rootStyles = computed(() => ['or-card-collection', ...CardCollectionRoot, classAttribute.value]);
166
- const toolbarStyles = computed(() => [...CardCollectionToolbar]);
167
- const toolbarPanelStyles = computed(() => [...CardCollectionToolbarPanel]);
168
- const sortLabel = computed(() => {
169
- var _a;
170
- return (_a = props.sortOptions.find(item => item.value === props.sort)) === null || _a === void 0 ? void 0 : _a.label;
171
- });
172
- // State
173
- const proxyView = ref(props.view);
174
- const proxySort = ref(props.sort);
175
- const proxySearch = ref(props.search);
176
- // Methods
177
- function switchView(view) {
178
- proxyView.value = view;
179
- }
180
- function handleSort(sort) {
181
- proxySort.value = sort;
182
- }
183
- function handleSearch(search) {
184
- proxySearch.value = search;
185
- }
186
- // Effects
187
- watch(() => props.view, value => {
188
- proxyView.value = value;
189
- });
190
- watch(proxyView, value => {
191
- context.emit('viewChange', value);
192
- });
193
- watch(() => props.sort, value => {
194
- proxySort.value = value;
195
- });
196
- watch(proxySort, value => {
197
- context.emit('sortChange', value);
198
- });
199
- watch(() => props.search, value => {
200
- proxySearch.value = value;
201
- });
202
- watch(proxySearch, value => {
203
- context.emit('searchChange', value);
204
- });
205
- return {
206
- root,
207
- sortMenu,
208
- sortButton,
209
- rootStyles,
210
- toolbarStyles,
211
- toolbarPanelStyles,
212
- proxyView,
213
- proxySort,
214
- proxySearch,
215
- sortLabel,
216
- switchView,
217
- handleSort,
218
- handleSearch
219
- };
220
- }
221
- });
222
-
223
- /* script */
224
- const __vue_script__ = script;
225
-
226
- /* template */
227
- var __vue_render__ = function () {
228
- var _vm = this;
229
- var _h = _vm.$createElement;
230
- var _c = _vm._self._c || _h;
231
- return _c('div', _vm._b({
232
- ref: "root",
233
- class: _vm.rootStyles
234
- }, 'div', _vm.$attrs, false), [_c('div', {
235
- class: _vm.toolbarStyles
236
- }, [_c('div', {
237
- class: _vm.toolbarPanelStyles
238
- }, [_vm.sortOptions.length ? [_c('OrButton', {
239
- ref: "sortButton",
240
- attrs: {
241
- "variant": "link",
242
- "color": "inherit"
243
- },
244
- on: {
245
- "click": function ($event) {
246
- return _vm.sortMenu.toggle();
247
- }
248
- }
249
- }, [_vm._v("\n " + _vm._s(_vm.sortLabel) + "\n "), _vm.sortMenu ? _c('OrIcon', {
250
- attrs: {
251
- "icon": _vm.sortMenu.isOpen ? 'arrow_drop_up' : 'arrow_drop_down'
252
- }
253
- }) : _vm._e()], 1), _vm._v(" "), _c('OrMenu', {
254
- ref: "sortMenu",
255
- attrs: {
256
- "trigger": _vm.sortButton && _vm.sortButton.root
257
- }
258
- }, _vm._l(_vm.sortOptions, function (sortItem) {
259
- return _c('OrMenuItem', {
260
- key: sortItem,
261
- on: {
262
- "click": function ($event) {
263
- return _vm.handleSort(sortItem.value);
264
- }
265
- }
266
- }, [_vm._v("\n " + _vm._s(sortItem.label) + "\n ")]);
267
- }), 1)] : _vm._e()], 2), _vm._v(" "), _c('div', {
268
- class: _vm.toolbarPanelStyles
269
- }, [_c('OrSearch', {
270
- staticClass: "md:w-[350px]",
271
- attrs: {
272
- "size": "s"
273
- },
274
- on: {
275
- "search": _vm.handleSearch
276
- },
277
- model: {
278
- value: _vm.proxySearch,
279
- callback: function ($$v) {
280
- _vm.proxySearch = $$v;
281
- },
282
- expression: "proxySearch"
283
- }
284
- }), _vm._v(" "), _c('div', {
285
- staticClass: "layout-row gap-sm"
286
- }, [_vm.viewModes.length > 1 ? _vm._l(_vm.viewModes, function (viewOption) {
287
- return _c('OrIconButton', {
288
- key: viewOption.view,
289
- attrs: {
290
- "icon": {
291
- icon: viewOption.icon,
292
- variant: viewOption.view === _vm.proxyView ? 'filled' : 'outlined'
293
- }
294
- },
295
- on: {
296
- "click": function ($event) {
297
- return _vm.switchView(viewOption.view);
298
- }
299
- }
300
- });
301
- }) : _vm._e(), _vm._v(" "), _vm._t("addon")], 2)], 1)]), _vm._v(" "), _vm._t("header", null, null, {
302
- items: _vm.items,
303
- mode: _vm.proxyView
304
- }), _vm._v(" "), _vm.items.length ? _vm._t(_vm.proxyView, function () {
305
- return [_c('OrCardCollectionView', {
306
- attrs: {
307
- "items": _vm.items,
308
- "mode": _vm.proxyView
309
- },
310
- scopedSlots: _vm._u([{
311
- key: "item",
312
- fn: function (props) {
313
- return [_vm._t("item", null, null, props)];
314
- }
315
- }], null, true)
316
- })];
317
- }, null, {
318
- items: _vm.items
319
- }) : _vm.items.length === 0 && _vm.proxySearch.length > 0 ? _vm._t("noSearchResults", function () {
320
- return [_vm._v("\n No results\n ")];
321
- }, null, {
322
- search: _vm.proxySearch
323
- }) : _vm._e()], 2);
324
- };
325
- var __vue_staticRenderFns__ = [];
326
-
327
- /* style */
328
- const __vue_inject_styles__ = undefined;
329
- /* scoped */
330
- const __vue_scope_id__ = undefined;
331
- /* module identifier */
332
- const __vue_module_identifier__ = undefined;
333
- /* functional template */
334
- const __vue_is_functional_template__ = false;
335
- /* style inject */
336
-
337
- /* style inject SSR */
338
-
339
- /* style inject shadow dom */
340
-
341
- const __vue_component__ = /*#__PURE__*/normalizeComponent({
342
- render: __vue_render__,
343
- staticRenderFns: __vue_staticRenderFns__
344
- }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
345
- var __vue_component__$1 = __vue_component__;
346
-
347
- export { CardCollectionView as C, __vue_component__$1 as _ };
@@ -1,35 +0,0 @@
1
- import { PropType } from 'vue-demi';
2
- import { CardCollectionItem } from './types';
3
- import { CardCollectionView } from './props';
4
- declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
5
- contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
6
- }> & import("@vue/composition-api").Data, {}, {}, {
7
- items: {
8
- type: PropType<CardCollectionItem[]>;
9
- default: CardCollectionItem[];
10
- };
11
- mode: {
12
- type: PropType<CardCollectionView>;
13
- required: true;
14
- };
15
- }, import("@vue/composition-api").ExtractPropTypes<{
16
- items: {
17
- type: PropType<CardCollectionItem[]>;
18
- default: CardCollectionItem[];
19
- };
20
- mode: {
21
- type: PropType<CardCollectionView>;
22
- required: true;
23
- };
24
- }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
25
- items: CardCollectionItem[];
26
- mode: CardCollectionView;
27
- } & {}, import("@vue/composition-api").ShallowUnwrapRef<{
28
- contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
29
- }>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
30
- items: CardCollectionItem[];
31
- mode: CardCollectionView;
32
- } & {}, {
33
- items: CardCollectionItem[];
34
- }, true>);
35
- export default _default;
@@ -1,4 +0,0 @@
1
- import { ViewMode } from './types';
2
- export declare const gridView: ViewMode;
3
- export declare const listView: ViewMode;
4
- export declare const defaultViewModes: ViewMode[];
@@ -1,33 +0,0 @@
1
- import { s as script } from './OrButton.vue_vue_type_script_lang-3718b300.js';
2
- import { resolveComponent, openBlock, createElementBlock, mergeProps, createElementVNode, normalizeClass, renderSlot, createBlock, Fragment, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
3
-
4
- const _hoisted_1 = ["type", "disabled"];
5
- const _hoisted_2 = {
6
- key: 0,
7
- class: /*#__PURE__*/normalizeClass(['absolute'])
8
- };
9
- function render(_ctx, _cache, $props, $setup, $data, $options) {
10
- const _component_OrLoader = resolveComponent("OrLoader");
11
- return openBlock(), createElementBlock("button", mergeProps({
12
- ref: "root"
13
- }, _ctx.$attrs, {
14
- class: _ctx.rootStyles,
15
- type: _ctx.type,
16
- disabled: _ctx.disabled,
17
- onClick: _cache[0] || (_cache[0] = $event => _ctx.$emit('click', $event)),
18
- onFocus: _cache[1] || (_cache[1] = $event => _ctx.$emit('focus', $event)),
19
- onBlur: _cache[2] || (_cache[2] = $event => _ctx.$emit('blur', $event))
20
- }), [createElementVNode("div", {
21
- class: normalizeClass(['contents', _ctx.loading && 'invisible'])
22
- }, [renderSlot(_ctx.$slots, "default")], 2 /* CLASS */), _ctx.loading ? (openBlock(), createElementBlock("div", _hoisted_2, [_ctx.variant !== 'link' ? (openBlock(), createBlock(_component_OrLoader, {
23
- key: 0,
24
- variant: 'circular',
25
- color: 'inherit',
26
- size: 's'
27
- })) : (openBlock(), createElementBlock(Fragment, {
28
- key: 1
29
- }, [createTextVNode(toDisplayString(_ctx.loadingText) + "… ", 1 /* TEXT */)], 64 /* STABLE_FRAGMENT */))])) : createCommentVNode("v-if", true)], 16 /* FULL_PROPS */, _hoisted_1);
30
- }
31
-
32
- script.render = render;
33
- script.__file = "src/components/or-button-v3/OrButton.vue";
@@ -1,229 +0,0 @@
1
- import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, Fragment, renderList, renderSlot, mergeProps, createTextVNode, toDisplayString, resolveComponent, createBlock, ref, watch } from 'vue';
2
- import './OrIconButton-4bd33e3c.js';
3
- import { s as script$3 } from './OrIconButton.vue_vue_type_script_lang-641f6e06.js';
4
- import './OrButton-8ab33d9d.js';
5
- import './OrMenu-f26e8e55.js';
6
- import { s as script$5 } from './OrMenu.vue_vue_type_script_lang-2446a69a.js';
7
- import './OrMenuItem-4feaba6c.js';
8
- import { s as script$6 } from './OrMenuItem.vue_vue_type_script_lang-0ffaef05.js';
9
- import './OrIcon-d878b768.js';
10
- import { s as script$2 } from './OrSearch.vue_vue_type_script_lang-0ae8a6dd.js';
11
- import { u as useClassAttribute } from './useClassAttribute-00888f78.js';
12
- import { s as script$4 } from './OrButton.vue_vue_type_script_lang-3718b300.js';
13
- import { s as script$7 } from './OrIcon.vue_vue_type_script_lang-a119a715.js';
14
-
15
- var CardCollectionView;
16
- (function (CardCollectionView) {
17
- CardCollectionView["Grid"] = "grid";
18
- CardCollectionView["List"] = "list";
19
- })(CardCollectionView || (CardCollectionView = {}));
20
-
21
- const CardCollectionRoot = [
22
- // Layout
23
- 'layout-column',
24
- // Spacing
25
- 'gap-md'];
26
- const CardCollectionToolbar = [
27
- // Layout
28
- 'layout-row justify-between',
29
- // Typography
30
- 'typography-body-2-regular',
31
- // Theme
32
- 'theme-foreground-default', 'dark:theme-foreground-default-dark'];
33
- const CardCollectionToolbarPanel = [
34
- // Layout
35
- 'layout-row',
36
- // Spacing
37
- 'gap-lg+'];
38
- const CardCollectionContent = [
39
- // Layout
40
- 'grid',
41
- // Spacing
42
- 'gap-sm md:gap-md'];
43
- const CardCollectionContentViews = {
44
- 'grid': [
45
- // Layout
46
- 'sm:grid-cols-1', 'md:grid-cols-2', 'lg:grid-cols-4', 'xl:grid-cols-6'],
47
- 'list': []
48
- };
49
-
50
- var script$1 = defineComponent({
51
- name: 'OrCardCollectionView',
52
- props: {
53
- items: {
54
- type: Array,
55
- default: []
56
- },
57
- mode: {
58
- type: String,
59
- required: true
60
- }
61
- },
62
- setup(props) {
63
- const contentStyles = computed(() => [...CardCollectionContent, ...CardCollectionContentViews[props.mode]]);
64
- return {
65
- contentStyles
66
- };
67
- }
68
- });
69
-
70
- function render$1(_ctx, _cache, $props, $setup, $data, $options) {
71
- return openBlock(), createElementBlock("div", {
72
- class: normalizeClass(_ctx.contentStyles)
73
- }, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.items, (item, index) => {
74
- return renderSlot(_ctx.$slots, "item", mergeProps({
75
- key: item.key || index
76
- }, {
77
- item,
78
- mode: _ctx.mode
79
- }), () => [createTextVNode(toDisplayString(item.key), 1 /* TEXT */)]);
80
- }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */);
81
- }
82
-
83
- script$1.render = render$1;
84
- script$1.__file = "src/components/or-card-collection-v3/OrCardCollectionView.vue3.vue";
85
-
86
- function render(_ctx, _cache, $props, $setup, $data, $options) {
87
- const _component_OrInput = resolveComponent("OrInput");
88
- return openBlock(), createBlock(_component_OrInput, mergeProps({
89
- ref: "root"
90
- }, _ctx.$attrs, {
91
- modelValue: _ctx.localModelValue,
92
- "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => _ctx.localModelValue = $event),
93
- modelModifiers: {
94
- trim: true
95
- },
96
- class: _ctx.rootStyles,
97
- type: 'search',
98
- size: _ctx.size,
99
- placeholder: _ctx.placeholder,
100
- debounce: _ctx.debounce,
101
- disabled: _ctx.disabled,
102
- "disable-default-styles": _ctx.disableDefaultStyles,
103
- onInput: _cache[1] || (_cache[1] = $event => _ctx.$emit('input', $event)),
104
- onKeydown: _cache[2] || (_cache[2] = $event => _ctx.$emit('keydown', $event)),
105
- onKeyup: _cache[3] || (_cache[3] = $event => _ctx.$emit('keyup', $event)),
106
- onFocus: _cache[4] || (_cache[4] = $event => _ctx.$emit('focus', $event)),
107
- onBlur: _cache[5] || (_cache[5] = $event => _ctx.$emit('blur', $event))
108
- }), null, 16 /* FULL_PROPS */, ["modelValue", "class", "size", "placeholder", "debounce", "disabled", "disable-default-styles"]);
109
- }
110
-
111
- script$2.render = render;
112
- script$2.__file = "src/components/or-search-v3/OrSearch.vue";
113
-
114
- const gridView = {
115
- view: 'grid',
116
- icon: 'grid_view'
117
- };
118
- const listView = {
119
- view: 'list',
120
- icon: 'view_agenda'
121
- };
122
- const defaultViewModes = [gridView, listView];
123
-
124
- var script = defineComponent({
125
- name: 'OrCardCollection',
126
- components: {
127
- OrCardCollectionView: script$1,
128
- OrIconButton: script$3,
129
- OrButton: script$4,
130
- OrMenu: script$5,
131
- OrMenuItem: script$6,
132
- OrIcon: script$7,
133
- OrSearch: script$2
134
- },
135
- inheritAttrs: false,
136
- props: {
137
- items: {
138
- type: Array,
139
- default: []
140
- },
141
- view: {
142
- type: String,
143
- default: CardCollectionView.Grid
144
- },
145
- viewModes: {
146
- type: Array,
147
- default: () => defaultViewModes
148
- },
149
- sort: {
150
- type: String,
151
- default: undefined
152
- },
153
- sortOptions: {
154
- type: Array,
155
- default: () => []
156
- },
157
- search: {
158
- type: String,
159
- default: ''
160
- }
161
- },
162
- emits: ['viewChange', 'sortChange', 'searchChange'],
163
- expose: ['root'],
164
- setup(props, context) {
165
- // Refs
166
- const root = ref();
167
- const sortMenu = ref();
168
- const sortButton = ref();
169
- // Styles
170
- const classAttribute = useClassAttribute();
171
- const rootStyles = computed(() => ['or-card-collection', ...CardCollectionRoot, classAttribute.value]);
172
- const toolbarStyles = computed(() => [...CardCollectionToolbar]);
173
- const toolbarPanelStyles = computed(() => [...CardCollectionToolbarPanel]);
174
- const sortLabel = computed(() => {
175
- var _a;
176
- return (_a = props.sortOptions.find(item => item.value === props.sort)) === null || _a === void 0 ? void 0 : _a.label;
177
- });
178
- // State
179
- const proxyView = ref(props.view);
180
- const proxySort = ref(props.sort);
181
- const proxySearch = ref(props.search);
182
- // Methods
183
- function switchView(view) {
184
- proxyView.value = view;
185
- }
186
- function handleSort(sort) {
187
- proxySort.value = sort;
188
- }
189
- function handleSearch(search) {
190
- proxySearch.value = search;
191
- }
192
- // Effects
193
- watch(() => props.view, value => {
194
- proxyView.value = value;
195
- });
196
- watch(proxyView, value => {
197
- context.emit('viewChange', value);
198
- });
199
- watch(() => props.sort, value => {
200
- proxySort.value = value;
201
- });
202
- watch(proxySort, value => {
203
- context.emit('sortChange', value);
204
- });
205
- watch(() => props.search, value => {
206
- proxySearch.value = value;
207
- });
208
- watch(proxySearch, value => {
209
- context.emit('searchChange', value);
210
- });
211
- return {
212
- root,
213
- sortMenu,
214
- sortButton,
215
- rootStyles,
216
- toolbarStyles,
217
- toolbarPanelStyles,
218
- proxyView,
219
- proxySort,
220
- proxySearch,
221
- sortLabel,
222
- switchView,
223
- handleSort,
224
- handleSearch
225
- };
226
- }
227
- });
228
-
229
- export { CardCollectionView as C, script as s };
@@ -1,29 +0,0 @@
1
- import { s as script } from './OrMenu.vue_vue_type_script_lang-2446a69a.js';
2
- import { resolveComponent, openBlock, createElementBlock, mergeProps, createVNode, withCtx, createElementVNode, normalizeClass, withModifiers, renderSlot } from 'vue';
3
-
4
- function render(_ctx, _cache, $props, $setup, $data, $options) {
5
- const _component_OrPopover = resolveComponent("OrPopover");
6
- return openBlock(), createElementBlock("div", mergeProps({
7
- ref: "root"
8
- }, _ctx.$attrs, {
9
- class: _ctx.rootStyles
10
- }), [createVNode(_component_OrPopover, {
11
- ref: "popover",
12
- variant: 'auto',
13
- trigger: _ctx.trigger,
14
- placement: _ctx.placement,
15
- "full-width": false,
16
- "disable-default-styles": false,
17
- "onUpdate:state": _cache[1] || (_cache[1] = $event => _ctx.$emit('update:state', $event))
18
- }, {
19
- default: withCtx(() => [createElementVNode("div", {
20
- class: normalizeClass(_ctx.bodyStyles),
21
- onClick: _cache[0] || (_cache[0] = withModifiers((...args) => _ctx.onClick && _ctx.onClick(...args), ["stop"]))
22
- }, [renderSlot(_ctx.$slots, "default")], 2 /* CLASS */)]),
23
-
24
- _: 3 /* FORWARDED */
25
- }, 8 /* PROPS */, ["trigger", "placement"])], 16 /* FULL_PROPS */);
26
- }
27
-
28
- script.render = render;
29
- script.__file = "src/components/or-menu-v3/OrMenu.vue";