@onereach/ui-components 2.69.7 → 2.69.8-beta.2189.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 (103) hide show
  1. package/dist/bundled/v2/{OrButton-4b99c680.js → OrButton-a846fa7e.js} +10 -1
  2. package/dist/bundled/v2/{OrCardCollection-754aa36f.js → OrCardCollection-0141a358.js} +1 -1
  3. package/dist/bundled/v2/{OrConfirm-cf334659.js → OrConfirm-23c3ce56.js} +1 -1
  4. package/dist/bundled/v2/OrPagination-379c10b8.js +308 -0
  5. package/dist/bundled/v2/{OrSelect-2e48be47.js → OrSelect-20226912.js} +15 -8
  6. package/dist/bundled/v2/components/index.d.ts +1 -0
  7. package/dist/bundled/v2/components/index.js +5 -4
  8. package/dist/bundled/v2/components/or-button-v3/OrButton.vue.d.ts +11 -0
  9. package/dist/bundled/v2/components/or-button-v3/index.js +1 -1
  10. package/dist/bundled/v2/components/or-card-collection-v3/index.js +2 -2
  11. package/dist/bundled/v2/components/or-confirm-v3/index.js +2 -2
  12. package/dist/bundled/v2/components/or-pagination-v3/OrPagination.stories3.d.ts +12 -0
  13. package/dist/bundled/v2/components/or-pagination-v3/OrPagination.vue.d.ts +112 -0
  14. package/dist/bundled/v2/components/or-pagination-v3/index.d.ts +2 -0
  15. package/dist/bundled/v2/components/or-pagination-v3/index.js +20 -0
  16. package/dist/bundled/v2/components/or-pagination-v3/styles.d.ts +4 -0
  17. package/dist/bundled/v2/components/or-pagination-v3/types.d.ts +4 -0
  18. package/dist/bundled/v2/components/or-select-v3/OrSelect.vue.d.ts +25 -14
  19. package/dist/bundled/v2/components/or-select-v3/index.d.ts +1 -0
  20. package/dist/bundled/v2/components/or-select-v3/index.js +1 -1
  21. package/dist/bundled/v2/components/or-select-v3/types.d.ts +1 -1
  22. package/dist/bundled/v2/index.js +6 -5
  23. package/dist/bundled/v3/{OrButton-a671b8a1.js → OrButton-2b27c1fd.js} +3 -2
  24. package/dist/bundled/v3/{OrButton.vue_vue_type_script_lang-b0dc31ca.js → OrButton.vue_vue_type_script_lang-8c44986c.js} +9 -1
  25. package/dist/bundled/v3/{OrCardCollection.vue_vue_type_script_lang-365741ae.js → OrCardCollection.vue_vue_type_script_lang-2d78a51a.js} +2 -2
  26. package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-68329ca1.js → OrConfirm.vue_vue_type_script_lang-05b21989.js} +2 -2
  27. package/dist/bundled/v3/OrPagination.vue_vue_type_script_lang-c96d7cd7.js +187 -0
  28. package/dist/bundled/v3/{OrSelect.vue_vue_type_script_lang-a5ecc5ed.js → OrSelect.vue_vue_type_script_lang-edc5eb2d.js} +6 -2
  29. package/dist/bundled/v3/components/index.d.ts +1 -0
  30. package/dist/bundled/v3/components/index.js +6 -5
  31. package/dist/bundled/v3/components/or-button-v3/OrButton.vue.d.ts +11 -0
  32. package/dist/bundled/v3/components/or-button-v3/index.js +1 -1
  33. package/dist/bundled/v3/components/or-card-collection-v3/index.js +3 -3
  34. package/dist/bundled/v3/components/or-confirm-v3/index.js +3 -3
  35. package/dist/bundled/v3/components/or-pagination-v3/OrPagination.stories3.d.ts +12 -0
  36. package/dist/bundled/v3/components/or-pagination-v3/OrPagination.vue.d.ts +112 -0
  37. package/dist/bundled/v3/components/or-pagination-v3/index.d.ts +2 -0
  38. package/dist/bundled/v3/components/or-pagination-v3/index.js +22 -0
  39. package/dist/bundled/v3/components/or-pagination-v3/styles.d.ts +4 -0
  40. package/dist/bundled/v3/components/or-pagination-v3/types.d.ts +4 -0
  41. package/dist/bundled/v3/components/or-select-v3/OrSelect.vue.d.ts +25 -14
  42. package/dist/bundled/v3/components/or-select-v3/index.d.ts +1 -0
  43. package/dist/bundled/v3/components/or-select-v3/index.js +1 -1
  44. package/dist/bundled/v3/components/or-select-v3/types.d.ts +1 -1
  45. package/dist/bundled/v3/index.js +253 -162
  46. package/dist/esm/v2/{OrButton-357e1e2c.js → OrButton-835d4f11.js} +10 -1
  47. package/dist/esm/v2/{OrCardCollection-153b0179.js → OrCardCollection-3c38fc85.js} +1 -1
  48. package/dist/esm/v2/{OrConfirm-d67d5c00.js → OrConfirm-e2ab9b4c.js} +1 -1
  49. package/dist/esm/v2/OrPagination-c0dbec6a.js +308 -0
  50. package/dist/esm/v2/{OrSelect-b3794fd3.js → OrSelect-2b198f4f.js} +15 -8
  51. package/dist/esm/v2/components/index.d.ts +1 -0
  52. package/dist/esm/v2/components/index.js +5 -4
  53. package/dist/esm/v2/components/or-button-v3/OrButton.vue.d.ts +11 -0
  54. package/dist/esm/v2/components/or-button-v3/index.js +1 -1
  55. package/dist/esm/v2/components/or-card-collection-v3/index.js +2 -2
  56. package/dist/esm/v2/components/or-confirm-v3/index.js +2 -2
  57. package/dist/esm/v2/components/or-pagination-v3/OrPagination.stories3.d.ts +12 -0
  58. package/dist/esm/v2/components/or-pagination-v3/OrPagination.vue.d.ts +112 -0
  59. package/dist/esm/v2/components/or-pagination-v3/index.d.ts +2 -0
  60. package/dist/esm/v2/components/or-pagination-v3/index.js +18 -0
  61. package/dist/esm/v2/components/or-pagination-v3/styles.d.ts +4 -0
  62. package/dist/esm/v2/components/or-pagination-v3/types.d.ts +4 -0
  63. package/dist/esm/v2/components/or-select-v3/OrSelect.vue.d.ts +25 -14
  64. package/dist/esm/v2/components/or-select-v3/index.d.ts +1 -0
  65. package/dist/esm/v2/components/or-select-v3/index.js +1 -1
  66. package/dist/esm/v2/components/or-select-v3/types.d.ts +1 -1
  67. package/dist/esm/v2/index.js +5 -4
  68. package/dist/esm/v3/{OrButton-bb6bf8a9.js → OrButton-0fa67a0d.js} +11 -2
  69. package/dist/esm/v3/{OrCardCollection-a09ad585.js → OrCardCollection-dbb3e839.js} +1 -1
  70. package/dist/esm/v3/{OrConfirm-b93b5131.js → OrConfirm-1bcd39b1.js} +1 -1
  71. package/dist/esm/v3/OrPagination-a703307d.js +269 -0
  72. package/dist/esm/v3/{OrSelect-a0718c44.js → OrSelect-f42de9d8.js} +19 -9
  73. package/dist/esm/v3/components/index.d.ts +1 -0
  74. package/dist/esm/v3/components/index.js +5 -4
  75. package/dist/esm/v3/components/or-button-v3/OrButton.vue.d.ts +11 -0
  76. package/dist/esm/v3/components/or-button-v3/index.js +1 -1
  77. package/dist/esm/v3/components/or-card-collection-v3/index.js +2 -2
  78. package/dist/esm/v3/components/or-confirm-v3/index.js +2 -2
  79. package/dist/esm/v3/components/or-pagination-v3/OrPagination.stories3.d.ts +12 -0
  80. package/dist/esm/v3/components/or-pagination-v3/OrPagination.vue.d.ts +112 -0
  81. package/dist/esm/v3/components/or-pagination-v3/index.d.ts +2 -0
  82. package/dist/esm/v3/components/or-pagination-v3/index.js +17 -0
  83. package/dist/esm/v3/components/or-pagination-v3/styles.d.ts +4 -0
  84. package/dist/esm/v3/components/or-pagination-v3/types.d.ts +4 -0
  85. package/dist/esm/v3/components/or-select-v3/OrSelect.vue.d.ts +25 -14
  86. package/dist/esm/v3/components/or-select-v3/index.d.ts +1 -0
  87. package/dist/esm/v3/components/or-select-v3/index.js +1 -1
  88. package/dist/esm/v3/components/or-select-v3/types.d.ts +1 -1
  89. package/dist/esm/v3/index.js +5 -4
  90. package/package.json +2 -3
  91. package/src/components/index.ts +1 -0
  92. package/src/components/or-button-v3/OrButton.stories3.ts +4 -0
  93. package/src/components/or-button-v3/OrButton.vue +6 -0
  94. package/src/components/or-button-v3/styles.ts +9 -1
  95. package/src/components/or-pagination-v3/OrPagination.docs.mdx +7 -0
  96. package/src/components/or-pagination-v3/OrPagination.stories3.ts +87 -0
  97. package/src/components/or-pagination-v3/OrPagination.vue +270 -0
  98. package/src/components/or-pagination-v3/index.ts +2 -0
  99. package/src/components/or-pagination-v3/styles.ts +38 -0
  100. package/src/components/or-pagination-v3/types.ts +4 -0
  101. package/src/components/or-select-v3/OrSelect.vue +26 -14
  102. package/src/components/or-select-v3/index.ts +1 -0
  103. package/src/components/or-select-v3/types.ts +1 -1
@@ -0,0 +1,269 @@
1
+ import { defineComponent, ref, computed } from 'vue-demi';
2
+ import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
3
+ import '@vueuse/core';
4
+ import { s as script$1 } from './OrButton-0fa67a0d.js';
5
+ import { s as script$2 } from './OrIcon-b195169c.js';
6
+ import { s as script$4 } from './OrMenuItem-9da279f6.js';
7
+ import { s as script$3 } from './OrMenu-840038cd.js';
8
+ import './OrPopover-1075dd38.js';
9
+ import { resolveComponent, openBlock, createElementBlock, mergeProps, createElementVNode, normalizeClass, createVNode, withModifiers, withCtx, Fragment, renderList, createBlock, createTextVNode, toDisplayString } from 'vue';
10
+
11
+ const PaginationRoot = [
12
+ // Layout
13
+ 'layout-row',
14
+ // Spacing
15
+ 'gap-xl',
16
+ // Typography
17
+ 'typography-caption-regular',
18
+ // Theme
19
+ 'theme-foreground-outline', 'dark:theme-foreground-outline-dark'];
20
+ const PaginationOffsetControl = [
21
+ // Layout
22
+ 'layout-row',
23
+ // Spacing
24
+ 'gap-md'];
25
+ const PaginationLimitControl = [
26
+ // Layout
27
+ 'layout-row',
28
+ // Spacing
29
+ 'gap-sm'];
30
+ const PaginationItem = [
31
+ // Typography
32
+ 'typography-caption-regular',
33
+ // Typography (activated)
34
+ 'activated:typography-caption-bold'];
35
+
36
+ var script = defineComponent({
37
+ name: 'OrPagination',
38
+ components: {
39
+ OrButton: script$1,
40
+ OrIcon: script$2,
41
+ OrMenu: script$3,
42
+ OrMenuItem: script$4
43
+ },
44
+ inheritAttrs: false,
45
+ props: {
46
+ modelValue: {
47
+ type: Object,
48
+ default: undefined
49
+ },
50
+ value: {
51
+ type: Object,
52
+ default: undefined
53
+ },
54
+ length: {
55
+ type: Number,
56
+ required: true
57
+ },
58
+ pageSizeOptions: {
59
+ type: Array,
60
+ default: () => [50, 20, 10, 5]
61
+ }
62
+ },
63
+ emits: ['update:modelValue', 'input'],
64
+ expose: ['root'],
65
+ setup(props, context) {
66
+ // Refs
67
+ const root = ref();
68
+ const limitButton = ref();
69
+ const limitButtonRoot = computed(() => {
70
+ var _a;
71
+ return (_a = limitButton.value) === null || _a === void 0 ? void 0 : _a.root;
72
+ });
73
+ const limitMenu = ref();
74
+ const limitMenuRoot = computed(() => {
75
+ var _a;
76
+ return (_a = limitMenu.value) === null || _a === void 0 ? void 0 : _a.root;
77
+ });
78
+ // Styles
79
+ const classAttribute = useClassAttribute();
80
+ const rootStyles = computed(() => ['or-pagination', ...PaginationRoot, classAttribute.value]);
81
+ const offsetControlStyles = computed(() => [...PaginationOffsetControl]);
82
+ const limitControlStyles = computed(() => [...PaginationLimitControl]);
83
+ const itemStyles = computed(() => [...PaginationItem]);
84
+ // State
85
+ const proxyModelValue = computed({
86
+ get: () => {
87
+ var _a;
88
+ return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.value; // TODO: Remove Vue 2 fallback
89
+ },
90
+
91
+ set: value => {
92
+ context.emit('input', value);
93
+ context.emit('update:modelValue', value);
94
+ }
95
+ });
96
+ const currentLimit = computed({
97
+ get: () => {
98
+ var _a, _b;
99
+ return (_b = (_a = proxyModelValue.value) === null || _a === void 0 ? void 0 : _a.limit) !== null && _b !== void 0 ? _b : props.pageSizeOptions[0];
100
+ },
101
+ set: value => {
102
+ proxyModelValue.value = {
103
+ limit: value,
104
+ offset: 0
105
+ };
106
+ }
107
+ });
108
+ const currentOffset = computed({
109
+ get: () => {
110
+ var _a, _b;
111
+ return (_b = (_a = proxyModelValue.value) === null || _a === void 0 ? void 0 : _a.offset) !== null && _b !== void 0 ? _b : 0;
112
+ },
113
+ set: value => {
114
+ proxyModelValue.value = {
115
+ limit: currentLimit.value,
116
+ offset: value
117
+ };
118
+ }
119
+ });
120
+ const currentPage = computed({
121
+ get: () => {
122
+ return Math.floor(currentOffset.value / currentLimit.value) + 1;
123
+ },
124
+ set: value => {
125
+ currentOffset.value = (value - 1) * currentLimit.value;
126
+ }
127
+ });
128
+ const firstPage = computed(() => {
129
+ return 1;
130
+ });
131
+ const lastPage = computed(() => {
132
+ return Math.ceil(props.length / currentLimit.value);
133
+ });
134
+ const buttonGroup = computed(() => {
135
+ return Array.from({
136
+ length: lastPage.value
137
+ }, (_, index) => index + 1).map(page => {
138
+ switch (true) {
139
+ case page > firstPage.value && page < currentPage.value - 1:
140
+ case page > currentPage.value + 1 && page < lastPage.value:
141
+ return '…';
142
+ default:
143
+ return page;
144
+ }
145
+ }).reduce((accumulator, page) => {
146
+ if (accumulator[accumulator.length - 1] === page) {
147
+ return accumulator;
148
+ }
149
+ return [...accumulator, page];
150
+ }, []);
151
+ });
152
+ // Functions
153
+ function toPreviousPage() {
154
+ currentPage.value = currentPage.value - 1;
155
+ }
156
+ function toNextPage() {
157
+ currentPage.value = currentPage.value + 1;
158
+ }
159
+ function toPage(page) {
160
+ currentPage.value = page;
161
+ }
162
+ return {
163
+ root,
164
+ limitButton,
165
+ limitButtonRoot,
166
+ limitMenu,
167
+ limitMenuRoot,
168
+ rootStyles,
169
+ offsetControlStyles,
170
+ limitControlStyles,
171
+ itemStyles,
172
+ proxyModelValue,
173
+ currentLimit,
174
+ currentOffset,
175
+ currentPage,
176
+ firstPage,
177
+ lastPage,
178
+ buttonGroup,
179
+ toPreviousPage,
180
+ toNextPage,
181
+ toPage
182
+ };
183
+ }
184
+ });
185
+
186
+ function render(_ctx, _cache, $props, $setup, $data, $options) {
187
+ const _component_OrIcon = resolveComponent("OrIcon");
188
+ const _component_OrButton = resolveComponent("OrButton");
189
+ const _component_OrMenuItem = resolveComponent("OrMenuItem");
190
+ const _component_OrMenu = resolveComponent("OrMenu");
191
+ return openBlock(), createElementBlock("div", mergeProps({
192
+ ref: "root"
193
+ }, _ctx.$attrs, {
194
+ class: _ctx.rootStyles
195
+ }), [createElementVNode("div", {
196
+ class: normalizeClass(_ctx.offsetControlStyles)
197
+ }, [createVNode(_component_OrButton, {
198
+ class: normalizeClass(_ctx.itemStyles),
199
+ variant: 'link',
200
+ color: 'inherit',
201
+ disabled: _ctx.currentPage === _ctx.firstPage,
202
+ onClick: _cache[0] || (_cache[0] = withModifiers($event => _ctx.toPreviousPage(), ["stop"]))
203
+ }, {
204
+ default: withCtx(() => [createVNode(_component_OrIcon, {
205
+ icon: 'keyboard_arrow_left'
206
+ })]),
207
+ _: 1 /* STABLE */
208
+ }, 8 /* PROPS */, ["class", "disabled"]), (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.buttonGroup, (page, index) => {
209
+ return openBlock(), createBlock(_component_OrButton, {
210
+ key: index,
211
+ class: normalizeClass(_ctx.itemStyles),
212
+ variant: 'link',
213
+ color: 'inherit',
214
+ activated: _ctx.currentPage === page,
215
+ onClick: withModifiers($event => typeof page === 'number' && _ctx.toPage(page), ["stop"])
216
+ }, {
217
+ default: withCtx(() => [createTextVNode(toDisplayString(page), 1 /* TEXT */)]),
218
+
219
+ _: 2 /* DYNAMIC */
220
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["class", "activated", "onClick"]);
221
+ }), 128 /* KEYED_FRAGMENT */)), createVNode(_component_OrButton, {
222
+ class: normalizeClass(_ctx.itemStyles),
223
+ variant: 'link',
224
+ color: 'inherit',
225
+ disabled: _ctx.currentPage === _ctx.lastPage,
226
+ onClick: _cache[1] || (_cache[1] = withModifiers($event => _ctx.toNextPage(), ["stop"]))
227
+ }, {
228
+ default: withCtx(() => [createVNode(_component_OrIcon, {
229
+ icon: 'keyboard_arrow_right'
230
+ })]),
231
+ _: 1 /* STABLE */
232
+ }, 8 /* PROPS */, ["class", "disabled"])], 2 /* CLASS */), createElementVNode("div", {
233
+ class: normalizeClass(_ctx.limitControlStyles)
234
+ }, [createTextVNode(" Per page: "), createVNode(_component_OrButton, {
235
+ ref: "limitButton",
236
+ class: normalizeClass(_ctx.itemStyles),
237
+ variant: 'link',
238
+ color: 'inherit',
239
+ activated: true,
240
+ onClick: _cache[2] || (_cache[2] = withModifiers($event => _ctx.limitMenu.open(), ["stop"]))
241
+ }, {
242
+ default: withCtx(() => [createTextVNode(toDisplayString(_ctx.currentLimit) + " ", 1 /* TEXT */), createVNode(_component_OrIcon, {
243
+ icon: 'arrow_drop_down'
244
+ })]),
245
+ _: 1 /* STABLE */
246
+ }, 8 /* PROPS */, ["class"]), createVNode(_component_OrMenu, {
247
+ ref: "limitMenu",
248
+ trigger: _ctx.limitButtonRoot,
249
+ placement: 'top'
250
+ }, {
251
+ default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.pageSizeOptions, pageSize => {
252
+ return openBlock(), createBlock(_component_OrMenuItem, {
253
+ key: pageSize,
254
+ onClick: withModifiers($event => _ctx.currentLimit = pageSize, ["stop"])
255
+ }, {
256
+ default: withCtx(() => [createTextVNode(toDisplayString(pageSize), 1 /* TEXT */)]),
257
+
258
+ _: 2 /* DYNAMIC */
259
+ }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick"]);
260
+ }), 128 /* KEYED_FRAGMENT */))]),
261
+
262
+ _: 1 /* STABLE */
263
+ }, 8 /* PROPS */, ["trigger"])], 2 /* CLASS */)], 16 /* FULL_PROPS */);
264
+ }
265
+
266
+ script.render = render;
267
+ script.__file = "src/components/or-pagination-v3/OrPagination.vue";
268
+
269
+ export { script as s };
@@ -82,11 +82,11 @@ var script = defineComponent({
82
82
  default: []
83
83
  },
84
84
  modelValue: {
85
- type: [String, Array],
85
+ type: [String, Number, Array],
86
86
  default: undefined
87
87
  },
88
88
  value: {
89
- type: [String, Array],
89
+ type: [String, Number, Array],
90
90
  default: undefined
91
91
  },
92
92
  multiple: {
@@ -121,6 +121,10 @@ var script = defineComponent({
121
121
  type: Boolean,
122
122
  default: false
123
123
  },
124
+ disableDefaultStyles: {
125
+ type: Boolean,
126
+ default: false
127
+ },
124
128
  enableSearch: {
125
129
  type: Boolean,
126
130
  default: false
@@ -322,6 +326,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
322
326
  }, 8 /* PROPS */, ["control-id", "required", "disabled"])) : createCommentVNode("v-if", true), withDirectives((openBlock(), createBlock(_component_OrInputBox, {
323
327
  ref: "inputBox",
324
328
  class: normalizeClass([_ctx.popoverState === 'open' && 'rounded-b-0']),
329
+ variant: _ctx.disableDefaultStyles ? 'unstyled' : 'styled',
325
330
  size: _ctx.size,
326
331
  invalid: _ctx.invalid,
327
332
  readonly: _ctx.readonly,
@@ -335,12 +340,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
335
340
  disabled: _ctx.disabled,
336
341
  onFocus: _cache[0] || (_cache[0] = $event => _ctx.$emit('focus', $event)),
337
342
  onBlur: _cache[1] || (_cache[1] = $event => _ctx.$emit('blur', $event))
338
- }, [_ctx.proxyModelValue && _ctx.proxyModelValue.length > 0 ? (openBlock(), createElementBlock(Fragment, {
339
- key: 0
340
343
  }, [_ctx.multiple ? renderSlot(_ctx.$slots, "valueTemplate", {
341
344
  key: 0,
342
345
  model: _ctx.proxyModelValue
343
- }, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.selection, option => {
346
+ }, () => [_ctx.proxyModelValue && _ctx.proxyModelValue.length > 0 ? (openBlock(true), createElementBlock(Fragment, {
347
+ key: 0
348
+ }, renderList(_ctx.selection, option => {
344
349
  return openBlock(), createBlock(_component_OrTag, {
345
350
  key: option.value,
346
351
  variant: 'reset',
@@ -350,13 +355,18 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
350
355
 
351
356
  _: 2 /* DYNAMIC */
352
357
  }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onReset"]);
353
- }), 128 /* KEYED_FRAGMENT */))]) : renderSlot(_ctx.$slots, "valueTemplate", {
358
+ }), 128 /* KEYED_FRAGMENT */)) : (openBlock(), createElementBlock("span", {
354
359
  key: 1,
360
+ class: normalizeClass(_ctx.placeholderStyles)
361
+ }, toDisplayString(_ctx.placeholder), 3 /* TEXT, CLASS */))]) : (openBlock(), createElementBlock(Fragment, {
362
+ key: 1
363
+ }, [_ctx.proxyModelValue ? renderSlot(_ctx.$slots, "valueTemplate", {
364
+ key: 0,
355
365
  model: _ctx.proxyModelValue
356
- }, () => [createTextVNode(toDisplayString(_ctx.selection.label), 1 /* TEXT */)])], 64 /* STABLE_FRAGMENT */)) : (openBlock(), createElementBlock("span", {
366
+ }, () => [createTextVNode(toDisplayString(_ctx.selection.label), 1 /* TEXT */)]) : (openBlock(), createElementBlock("span", {
357
367
  key: 1,
358
368
  class: normalizeClass(_ctx.placeholderStyles)
359
- }, toDisplayString(_ctx.placeholder), 3 /* TEXT, CLASS */))], 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_1), _ctx.multiple && _ctx.outerItems.length > 0 ? (openBlock(), createElementBlock(Fragment, {
369
+ }, toDisplayString(_ctx.placeholder), 3 /* TEXT, CLASS */))], 64 /* STABLE_FRAGMENT */))], 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_1), _ctx.multiple && _ctx.outerItems.length > 0 ? (openBlock(), createElementBlock(Fragment, {
360
370
  key: 0
361
371
  }, [createTextVNode(" +" + toDisplayString(_ctx.outerItems.length), 1 /* TEXT */)], 64 /* STABLE_FRAGMENT */)) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_2, [createVNode(_component_OrIcon, {
362
372
  icon: _ctx.popoverState === 'open' ? 'arrow_drop_up' : 'arrow_drop_down',
@@ -471,7 +481,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
471
481
  _: 3 /* FORWARDED */
472
482
  }, 8 /* PROPS */, ["class", "trigger"])]),
473
483
  _: 3 /* FORWARDED */
474
- }, 8 /* PROPS */, ["class", "size", "invalid", "readonly", "disabled"])), [[_directive_dropdown_open, _ctx.toggle], [_directive_dropdown_close, _ctx.close]]), !_ctx.invalid ? (openBlock(), createElementBlock(Fragment, {
484
+ }, 8 /* PROPS */, ["class", "variant", "size", "invalid", "readonly", "disabled"])), [[_directive_dropdown_open, _ctx.toggle], [_directive_dropdown_close, _ctx.close]]), !_ctx.invalid ? (openBlock(), createElementBlock(Fragment, {
475
485
  key: 1
476
486
  }, [_ctx.hint ? (openBlock(), createBlock(_component_OrHint, {
477
487
  key: 0,
@@ -53,6 +53,7 @@ export * from './or-notification-v3';
53
53
  export * from './or-overflow-menu';
54
54
  export * from './or-overlay';
55
55
  export * from './or-overlay-v3';
56
+ export * from './or-pagination-v3';
56
57
  export * from './or-popover-v3';
57
58
  export * from './or-progress';
58
59
  export * from './or-progress-v3';
@@ -3,10 +3,10 @@ export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from '../OrAvatar-
3
3
  export { s as OrBottomSheetV3 } from '../OrBottomSheet-62817aec.js';
4
4
  export { s as OrButton, a as OrButtonColors, b as OrButtonSizes, O as OrButtonViews } from '../OrButton-fca9019a.js';
5
5
  export { b as BUTTON_COLOR, d as BUTTON_LOADER_TYPE, c as BUTTON_SIZE, B as BUTTON_TYPE, I as ICON_BUTTON_TYPE, s as OrButtonV2, a as OrIconButton } from '../OrIconButton-8be9c89f.js';
6
- export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from '../OrButton-bb6bf8a9.js';
6
+ export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from '../OrButton-0fa67a0d.js';
7
7
  export { s as OrCard } from '../OrCard-e3a5aea4.js';
8
8
  export { C as CARD_COLLECTION_LAYOUT, s as OrCardCollection } from '../OrCardCollection-a5e326ef.js';
9
- export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-a09ad585.js';
9
+ export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-dbb3e839.js';
10
10
  export { s as OrCardV3 } from '../OrCard-fd92f7c8.js';
11
11
  export { a as OrCarousel, s as OrCarouselItem } from '../OrCarouselItem-636d99a1.js';
12
12
  export { s as OrCheckbox } from '../OrCheckbox-ed4a19cf.js';
@@ -16,7 +16,7 @@ export { s as OrCode, O as OrCodeLanguages } from '../OrCode-5ed69c23.js';
16
16
  export { s as OrCollapse } from '../OrCollapse-445141ab.js';
17
17
  export { s as OrColorPicker, h as amber, n as black, b as blue, m as blueGrey, k as brown, c as cyan, j as deepOrange, d as deepPurple, g as green, i as indigo, l as lightBlue, e as lightGreen, f as lime, o as orange, p as pink, a as purple, r as red, t as teal, w as white, y as yellow } from '../OrColorPicker-189cb097.js';
18
18
  export { s as OrConfirm } from '../OrConfirm-f39bd784.js';
19
- export { C as ConfirmType, s as OrConfirmV3 } from '../OrConfirm-b93b5131.js';
19
+ export { C as ConfirmType, s as OrConfirmV3 } from '../OrConfirm-1bcd39b1.js';
20
20
  export { D as DEFAULT_TEXT, s as OrDateTimePicker, a as OrDateTimePickerItemTypes, O as OrDateTimePickerTypes } from '../OrDateTimePicker-f2e08564.js';
21
21
  export { s as OrError } from '../OrError-f90296db.js';
22
22
  export { s as OrErrorTagV3 } from '../OrErrorTag-98252eef.js';
@@ -54,6 +54,7 @@ export { N as NotificationVariant, s as OrNotificationV3 } from '../OrNotificati
54
54
  export { s as OrOverflowMenu } from '../OrOverflowMenu-e82cbcbe.js';
55
55
  export { s as OrOverlay } from '../OrOverlay-451dce49.js';
56
56
  export { s as OrOverlayV3 } from '../OrOverlay-738a44d5.js';
57
+ export { s as OrPaginationV3 } from '../OrPagination-a703307d.js';
57
58
  export { s as OrProgress, O as OrProgressColors, a as OrProgressTypes } from '../OrProgress-d0d52c86.js';
58
59
  export { s as OrProgressV3, P as ProgressColor, a as ProgressType } from '../OrProgress-407002e0.js';
59
60
  export { s as OrRadio } from '../OrRadio-c3ab11f2.js';
@@ -62,7 +63,7 @@ export { s as OrRadioV3 } from '../OrRadio-54b6d0de.js';
62
63
  export { s as OrSearchV3 } from '../OrSearch-9885d178.js';
63
64
  export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl-171cad78.js';
64
65
  export { s as OrSelect } from '../OrSelect-0821b907.js';
65
- export { s as OrSelectV3 } from '../OrSelect-a0718c44.js';
66
+ export { s as OrSelectV3 } from '../OrSelect-f42de9d8.js';
66
67
  export { s as OrSidebar, O as OrSidebarSide } from '../OrSidebar-375c85a3.js';
67
68
  export { O as OrSidebarPlacement, s as OrSidebarV3 } from '../OrSidebar-a62972f5.js';
68
69
  export { s as OrSkeletonCircle, a as OrSkeletonRect, b as OrSkeletonText, O as OrSkeletonTextSizes } from '../OrSkeletonText-2b1610ce.js';
@@ -16,6 +16,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
16
16
  type: PropType<ButtonColor>;
17
17
  default: ButtonColor;
18
18
  };
19
+ activated: {
20
+ type: BooleanConstructor;
21
+ default: boolean;
22
+ };
19
23
  disabled: {
20
24
  type: BooleanConstructor;
21
25
  default: boolean;
@@ -41,6 +45,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
41
45
  type: PropType<ButtonColor>;
42
46
  default: ButtonColor;
43
47
  };
48
+ activated: {
49
+ type: BooleanConstructor;
50
+ default: boolean;
51
+ };
44
52
  disabled: {
45
53
  type: BooleanConstructor;
46
54
  default: boolean;
@@ -54,6 +62,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
54
62
  default: string;
55
63
  };
56
64
  }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
65
+ activated: boolean;
57
66
  type: ButtonType;
58
67
  variant: ButtonVariant;
59
68
  color: ButtonColor;
@@ -66,6 +75,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
66
75
  root: import("@vue/composition-api").Ref<HTMLButtonElement | undefined>;
67
76
  rootStyles: import("@vue/composition-api").ComputedRef<(string | false | undefined)[]>;
68
77
  }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
78
+ activated: boolean;
69
79
  type: ButtonType;
70
80
  variant: ButtonVariant;
71
81
  color: ButtonColor;
@@ -75,6 +85,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
75
85
  } & {} & {
76
86
  [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
77
87
  }, {
88
+ activated: boolean;
78
89
  type: ButtonType;
79
90
  variant: ButtonVariant;
80
91
  color: ButtonColor;
@@ -1,4 +1,4 @@
1
- export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from '../../OrButton-bb6bf8a9.js';
1
+ export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from '../../OrButton-0fa67a0d.js';
2
2
  import 'vue-demi';
3
3
  import '../../useClassAttribute-47fdb016.js';
4
4
  import '@vueuse/core';
@@ -1,4 +1,4 @@
1
- export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection-a09ad585.js';
1
+ export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection-dbb3e839.js';
2
2
  import 'vue-demi';
3
3
  import '../../useClassAttribute-47fdb016.js';
4
4
  import '@vueuse/core';
@@ -15,7 +15,7 @@ import '../../OrOverlay-738a44d5.js';
15
15
  import '../../OrTeleport.vue3-8099178c.js';
16
16
  import '../../OrMenu-840038cd.js';
17
17
  import '../../OrMenuItem-9da279f6.js';
18
- import '../../OrButton-bb6bf8a9.js';
18
+ import '../../OrButton-0fa67a0d.js';
19
19
  import '../../OrLoader-b3cf4231.js';
20
20
  import '../../OrSearch-9885d178.js';
21
21
  import '../../OrInput-9c0426b9.js';
@@ -1,6 +1,6 @@
1
- export { C as ConfirmType, s as OrConfirmV3 } from '../../OrConfirm-b93b5131.js';
1
+ export { C as ConfirmType, s as OrConfirmV3 } from '../../OrConfirm-1bcd39b1.js';
2
2
  import 'vue-demi';
3
- import '../../OrButton-bb6bf8a9.js';
3
+ import '../../OrButton-0fa67a0d.js';
4
4
  import '../../useClassAttribute-47fdb016.js';
5
5
  import '@vueuse/core';
6
6
  import '../../OrLoader-b3cf4231.js';
@@ -0,0 +1,12 @@
1
+ import { Meta, StoryFn } from '@storybook/vue3';
2
+ declare const _default: Meta<import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<unknown>, import("@vue/composition-api").MethodOptions, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>, import("@vue/composition-api").ExtractPropTypes<import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
3
+ [x: string]: ((...args: any[]) => any) | null;
4
+ } | string[], {} & {}, {
5
+ [x: number]: string;
6
+ } | {}, true>)>;
7
+ export default _default;
8
+ export declare const Default: StoryFn<import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<unknown>, import("@vue/composition-api").MethodOptions, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>, import("@vue/composition-api").ExtractPropTypes<import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
9
+ [x: string]: ((...args: any[]) => any) | null;
10
+ } | string[], {} & {}, {
11
+ [x: number]: string;
12
+ } | {}, true>)>;
@@ -0,0 +1,112 @@
1
+ import { PropType } from 'vue-demi';
2
+ import { PaginationModel } from './types';
3
+ declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
4
+ root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
5
+ limitButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
6
+ [x: string]: ((...args: any[]) => any) | null;
7
+ } | string[], {} & {}, {
8
+ [x: number]: string;
9
+ } | {}, true> | undefined>;
10
+ limitButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
11
+ limitMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
12
+ [x: string]: ((...args: any[]) => any) | null;
13
+ } | string[], {} & {}, {
14
+ [x: number]: string;
15
+ } | {}, true> | undefined>;
16
+ limitMenuRoot: import("@vue/composition-api").ComputedRef<undefined>;
17
+ rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
18
+ offsetControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
19
+ limitControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
20
+ itemStyles: import("@vue/composition-api").ComputedRef<string[]>;
21
+ proxyModelValue: import("@vue/composition-api").WritableComputedRef<PaginationModel>;
22
+ currentLimit: import("@vue/composition-api").WritableComputedRef<number>;
23
+ currentOffset: import("@vue/composition-api").WritableComputedRef<number>;
24
+ currentPage: import("@vue/composition-api").WritableComputedRef<number>;
25
+ firstPage: import("@vue/composition-api").ComputedRef<number>;
26
+ lastPage: import("@vue/composition-api").ComputedRef<number>;
27
+ buttonGroup: import("@vue/composition-api").ComputedRef<(string | number)[]>;
28
+ toPreviousPage: () => void;
29
+ toNextPage: () => void;
30
+ toPage: (page: number) => void;
31
+ }> & import("@vue/composition-api").Data, {}, {}, {
32
+ modelValue: {
33
+ type: PropType<PaginationModel>;
34
+ default: undefined;
35
+ };
36
+ value: {
37
+ type: PropType<PaginationModel>;
38
+ default: undefined;
39
+ };
40
+ length: {
41
+ type: NumberConstructor;
42
+ required: true;
43
+ };
44
+ pageSizeOptions: {
45
+ type: PropType<number[]>;
46
+ default: () => number[];
47
+ };
48
+ }, import("@vue/composition-api").ExtractPropTypes<{
49
+ modelValue: {
50
+ type: PropType<PaginationModel>;
51
+ default: undefined;
52
+ };
53
+ value: {
54
+ type: PropType<PaginationModel>;
55
+ default: undefined;
56
+ };
57
+ length: {
58
+ type: NumberConstructor;
59
+ required: true;
60
+ };
61
+ pageSizeOptions: {
62
+ type: PropType<number[]>;
63
+ default: () => number[];
64
+ };
65
+ }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
66
+ length: number;
67
+ modelValue: PaginationModel;
68
+ value: PaginationModel;
69
+ pageSizeOptions: number[];
70
+ } & {} & {
71
+ [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
72
+ }, import("@vue/composition-api").ShallowUnwrapRef<{
73
+ root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
74
+ limitButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
75
+ [x: string]: ((...args: any[]) => any) | null;
76
+ } | string[], {} & {}, {
77
+ [x: number]: string;
78
+ } | {}, true> | undefined>;
79
+ limitButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
80
+ limitMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
81
+ [x: string]: ((...args: any[]) => any) | null;
82
+ } | string[], {} & {}, {
83
+ [x: number]: string;
84
+ } | {}, true> | undefined>;
85
+ limitMenuRoot: import("@vue/composition-api").ComputedRef<undefined>;
86
+ rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
87
+ offsetControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
88
+ limitControlStyles: import("@vue/composition-api").ComputedRef<string[]>;
89
+ itemStyles: import("@vue/composition-api").ComputedRef<string[]>;
90
+ proxyModelValue: import("@vue/composition-api").WritableComputedRef<PaginationModel>;
91
+ currentLimit: import("@vue/composition-api").WritableComputedRef<number>;
92
+ currentOffset: import("@vue/composition-api").WritableComputedRef<number>;
93
+ currentPage: import("@vue/composition-api").WritableComputedRef<number>;
94
+ firstPage: import("@vue/composition-api").ComputedRef<number>;
95
+ lastPage: import("@vue/composition-api").ComputedRef<number>;
96
+ buttonGroup: import("@vue/composition-api").ComputedRef<(string | number)[]>;
97
+ toPreviousPage: () => void;
98
+ toNextPage: () => void;
99
+ toPage: (page: number) => void;
100
+ }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
101
+ length: number;
102
+ modelValue: PaginationModel;
103
+ value: PaginationModel;
104
+ pageSizeOptions: number[];
105
+ } & {} & {
106
+ [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
107
+ }, {
108
+ modelValue: PaginationModel;
109
+ value: PaginationModel;
110
+ pageSizeOptions: number[];
111
+ }, true>);
112
+ export default _default;
@@ -0,0 +1,2 @@
1
+ export { default as OrPaginationV3 } from './OrPagination.vue';
2
+ export * from './types';
@@ -0,0 +1,17 @@
1
+ export { s as OrPaginationV3 } from '../../OrPagination-a703307d.js';
2
+ import 'vue-demi';
3
+ import '../../useClassAttribute-47fdb016.js';
4
+ import '@vueuse/core';
5
+ import '../../OrButton-0fa67a0d.js';
6
+ import '../../OrLoader-b3cf4231.js';
7
+ import 'vue';
8
+ import '../../OrIcon-b195169c.js';
9
+ import '../../OrMenuItem-9da279f6.js';
10
+ import '../../OrMenu-840038cd.js';
11
+ import '../../OrPopover-1075dd38.js';
12
+ import '@floating-ui/dom';
13
+ import '../../useElevation-31bfe1f6.js';
14
+ import '../../useResponsive-a02e95b7.js';
15
+ import '../../OrBottomSheet-62817aec.js';
16
+ import '../../OrOverlay-738a44d5.js';
17
+ import '../../OrTeleport.vue3-8099178c.js';
@@ -0,0 +1,4 @@
1
+ export declare const PaginationRoot: string[];
2
+ export declare const PaginationOffsetControl: string[];
3
+ export declare const PaginationLimitControl: string[];
4
+ export declare const PaginationItem: string[];
@@ -0,0 +1,4 @@
1
+ export interface PaginationModel {
2
+ limit: number;
3
+ offset: number;
4
+ }