@onereach/ui-components 2.69.2-beta.2123.0 → 2.69.2-beta.2128.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 (123) hide show
  1. package/dist/bundled/v2/{OrAvatar-2fa559e1.js → OrAvatar-ae61bfb9.js} +41 -15
  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/OrAvatar.stories3.d.ts +1 -1
  8. package/dist/bundled/v2/components/or-avatar-v3/OrAvatar.vue.d.ts +11 -0
  9. package/dist/bundled/v2/components/or-avatar-v3/index.js +2 -1
  10. package/dist/bundled/v2/components/or-avatar-v3/props.d.ts +2 -1
  11. package/dist/bundled/v2/components/or-avatar-v3/styles.d.ts +2 -0
  12. package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  13. package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollection.vue.d.ts +42 -67
  14. package/dist/bundled/v2/components/or-card-collection-v3/index.js +4 -7
  15. package/dist/bundled/v2/components/or-card-collection-v3/props.d.ts +1 -5
  16. package/dist/bundled/v2/components/or-card-collection-v3/styles.d.ts +2 -2
  17. package/dist/bundled/v2/components/or-card-collection-v3/types.d.ts +3 -8
  18. package/dist/bundled/v2/components/or-card-v3/index.js +1 -1
  19. package/dist/bundled/v2/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  20. package/dist/bundled/v2/components/or-search-v3/index.js +1 -1
  21. package/dist/bundled/v2/components/or-sort-header-v3/index.js +1 -1
  22. package/dist/bundled/v2/index.js +6 -6
  23. package/dist/bundled/v3/{OrAvatar.vue_vue_type_script_lang-22e46ce1.js → OrAvatar.vue_vue_type_script_lang-0426862b.js} +35 -13
  24. package/dist/bundled/v3/OrCardCollection.vue_vue_type_script_lang-861158b5.js +164 -0
  25. package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-85472b12.js → OrConfirm.vue_vue_type_script_lang-289b5600.js} +36 -6
  26. package/dist/bundled/v3/{OrIconButton-4bd33e3c.js → OrIconButton-1581013c.js} +1 -1
  27. package/dist/bundled/v3/{OrIconButton.vue_vue_type_script_lang-641f6e06.js → OrIconButton.vue_vue_type_script_lang-f6f801ff.js} +1 -1
  28. package/dist/bundled/v3/{OrInlineInput.vue_vue_type_script_lang-3a8189f4.js → OrInlineInput.vue_vue_type_script_lang-f29483f4.js} +2 -2
  29. package/dist/bundled/v3/{OrInlineTextarea.vue_vue_type_script_lang-890b97ab.js → OrInlineTextarea.vue_vue_type_script_lang-cc40af48.js} +2 -2
  30. package/dist/bundled/v3/OrInput.vue_vue_type_script_lang-f6d793d3.js +2 -2
  31. package/dist/bundled/v3/{OrModal.vue_vue_type_script_lang-00a477f0.js → OrModal.vue_vue_type_script_lang-80a7b906.js} +2 -2
  32. package/dist/bundled/v3/OrNotification.vue_vue_type_script_lang-fbb35355.js +2 -2
  33. package/dist/bundled/v3/{OrSearch.vue_vue_type_script_lang-0ae8a6dd.js → OrSearch.vue_vue_type_script_lang-ed78b21f.js} +2 -8
  34. package/dist/bundled/v3/OrSelect.vue_vue_type_script_lang-15285ce4.js +1 -1
  35. package/dist/bundled/v3/{OrTabs.vue_vue_type_script_lang-61b79a5a.js → OrTabs.vue_vue_type_script_lang-919b2021.js} +36 -10
  36. package/dist/bundled/v3/{OrTag.vue_vue_type_script_lang-92d9fb12.js → OrTag.vue_vue_type_script_lang-dc6a4011.js} +2 -2
  37. package/dist/bundled/v3/{OrToastContainer-afb51e5d.js → OrToastContainer-7c3c0b12.js} +1 -1
  38. package/dist/bundled/v3/components/index.js +15 -17
  39. package/dist/bundled/v3/components/or-avatar-v3/OrAvatar.stories3.d.ts +1 -1
  40. package/dist/bundled/v3/components/or-avatar-v3/OrAvatar.vue.d.ts +11 -0
  41. package/dist/bundled/v3/components/or-avatar-v3/index.js +3 -1
  42. package/dist/bundled/v3/components/or-avatar-v3/props.d.ts +2 -1
  43. package/dist/bundled/v3/components/or-avatar-v3/styles.d.ts +2 -0
  44. package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  45. package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollection.vue.d.ts +42 -67
  46. package/dist/bundled/v3/components/or-card-collection-v3/index.js +6 -13
  47. package/dist/bundled/v3/components/or-card-collection-v3/props.d.ts +1 -5
  48. package/dist/bundled/v3/components/or-card-collection-v3/styles.d.ts +2 -2
  49. package/dist/bundled/v3/components/or-card-collection-v3/types.d.ts +3 -8
  50. package/dist/bundled/v3/components/or-confirm-v3/index.js +3 -4
  51. package/dist/bundled/v3/components/or-icon-button-v3/index.js +1 -1
  52. package/dist/bundled/v3/components/or-inline-input-v3/index.js +3 -3
  53. package/dist/bundled/v3/components/or-inline-textarea-v3/index.js +3 -3
  54. package/dist/bundled/v3/components/or-input-v3/index.js +2 -2
  55. package/dist/bundled/v3/components/or-modal-v3/index.js +3 -3
  56. package/dist/bundled/v3/components/or-notification-v3/index.js +2 -2
  57. package/dist/bundled/v3/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  58. package/dist/bundled/v3/components/or-search-v3/index.js +3 -3
  59. package/dist/bundled/v3/components/or-select-v3/index.js +3 -3
  60. package/dist/bundled/v3/components/or-tabs-v3/index.js +1 -2
  61. package/dist/bundled/v3/components/or-tag-v3/index.js +3 -3
  62. package/dist/bundled/v3/components/or-toast-v3/index.js +4 -4
  63. package/dist/bundled/v3/index.js +314 -339
  64. package/dist/bundled/v3/{types-6c5eee23.js → types-dcc78caa.js} +2 -2
  65. package/dist/esm/v2/{OrAvatar-0afdef36.js → OrAvatar-3d155af3.js} +41 -15
  66. package/dist/esm/v2/OrCardCollection-4f001551.js +227 -0
  67. package/dist/esm/v2/{OrSearch-62d91301.js → OrSearch-ddb7c1fe.js} +1 -7
  68. package/dist/esm/v2/components/index.js +3 -3
  69. package/dist/esm/v2/components/or-avatar-v3/OrAvatar.stories3.d.ts +1 -1
  70. package/dist/esm/v2/components/or-avatar-v3/OrAvatar.vue.d.ts +11 -0
  71. package/dist/esm/v2/components/or-avatar-v3/index.js +2 -1
  72. package/dist/esm/v2/components/or-avatar-v3/props.d.ts +2 -1
  73. package/dist/esm/v2/components/or-avatar-v3/styles.d.ts +2 -0
  74. package/dist/esm/v2/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  75. package/dist/esm/v2/components/or-card-collection-v3/OrCardCollection.vue.d.ts +42 -67
  76. package/dist/esm/v2/components/or-card-collection-v3/index.js +4 -7
  77. package/dist/esm/v2/components/or-card-collection-v3/props.d.ts +1 -5
  78. package/dist/esm/v2/components/or-card-collection-v3/styles.d.ts +2 -2
  79. package/dist/esm/v2/components/or-card-collection-v3/types.d.ts +3 -8
  80. package/dist/esm/v2/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  81. package/dist/esm/v2/components/or-search-v3/index.js +1 -1
  82. package/dist/esm/v2/index.js +3 -3
  83. package/dist/esm/v3/{OrAvatar-ef88d31c.js → OrAvatar-53a4429d.js} +43 -16
  84. package/dist/esm/v3/OrCardCollection-5a0febaf.js +198 -0
  85. package/dist/esm/v3/{OrSearch-aafb93b4.js → OrSearch-cdde55ce.js} +1 -7
  86. package/dist/esm/v3/components/index.js +3 -3
  87. package/dist/esm/v3/components/or-avatar-v3/OrAvatar.stories3.d.ts +1 -1
  88. package/dist/esm/v3/components/or-avatar-v3/OrAvatar.vue.d.ts +11 -0
  89. package/dist/esm/v3/components/or-avatar-v3/index.js +2 -1
  90. package/dist/esm/v3/components/or-avatar-v3/props.d.ts +2 -1
  91. package/dist/esm/v3/components/or-avatar-v3/styles.d.ts +2 -0
  92. package/dist/esm/v3/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +0 -5
  93. package/dist/esm/v3/components/or-card-collection-v3/OrCardCollection.vue.d.ts +42 -67
  94. package/dist/esm/v3/components/or-card-collection-v3/index.js +4 -7
  95. package/dist/esm/v3/components/or-card-collection-v3/props.d.ts +1 -5
  96. package/dist/esm/v3/components/or-card-collection-v3/styles.d.ts +2 -2
  97. package/dist/esm/v3/components/or-card-collection-v3/types.d.ts +3 -8
  98. package/dist/esm/v3/components/or-search-v3/OrSearch.vue.d.ts +0 -13
  99. package/dist/esm/v3/components/or-search-v3/index.js +1 -1
  100. package/dist/esm/v3/index.js +3 -3
  101. package/package.json +1 -1
  102. package/src/components/or-avatar-v3/OrAvatar.stories3.ts +9 -7
  103. package/src/components/or-avatar-v3/OrAvatar.vue +22 -2
  104. package/src/components/or-avatar-v3/props.ts +1 -0
  105. package/src/components/or-avatar-v3/styles.ts +49 -11
  106. package/src/components/or-card-collection-v3/OrCardCollection.stories3.ts +30 -230
  107. package/src/components/or-card-collection-v3/OrCardCollection.vue +77 -120
  108. package/src/components/or-card-collection-v3/props.ts +1 -14
  109. package/src/components/or-card-collection-v3/styles.ts +3 -3
  110. package/src/components/or-card-collection-v3/types.ts +3 -9
  111. package/src/components/or-search-v3/OrSearch.vue +1 -7
  112. package/dist/bundled/v2/OrCardCollection-773ae0db.js +0 -346
  113. package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollectionView.vue2.vue.d.ts +0 -35
  114. package/dist/bundled/v3/OrButton-8ab33d9d.js +0 -33
  115. package/dist/bundled/v3/OrCardCollection.vue_vue_type_script_lang-b983bda7.js +0 -228
  116. package/dist/bundled/v3/OrMenu-f26e8e55.js +0 -29
  117. package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollectionView.vue3.vue.d.ts +0 -35
  118. package/dist/esm/v2/OrCardCollection-61c86bfc.js +0 -346
  119. package/dist/esm/v2/components/or-card-collection-v3/OrCardCollectionView.vue2.vue.d.ts +0 -35
  120. package/dist/esm/v3/OrCardCollection-fdc7848b.js +0 -289
  121. package/dist/esm/v3/components/or-card-collection-v3/OrCardCollectionView.vue3.vue.d.ts +0 -35
  122. package/src/components/or-card-collection-v3/OrCardCollectionView.vue2.vue +0 -41
  123. package/src/components/or-card-collection-v3/OrCardCollectionView.vue3.vue +0 -42
@@ -1,5 +1,6 @@
1
1
  import './index-fa6eb4ca.js';
2
2
  import { h as hslToColorString, g as generateHslFromString } from './color-1f348774.js';
3
+ import { O as OrIcon } from './OrIcon-8625385f.js';
3
4
  import { u as useClassAttribute } from './useClassAttribute-9bf33346.js';
4
5
  import { defineComponent, ref, computed, watchPostEffect } from '@vue/composition-api/dist/vue-composition-api.mjs';
5
6
  import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
@@ -10,6 +11,7 @@ var AvatarSize;
10
11
  AvatarSize["L"] = "l";
11
12
  AvatarSize["M"] = "m";
12
13
  AvatarSize["S"] = "s";
14
+ AvatarSize["XS"] = "xs";
13
15
  })(AvatarSize || (AvatarSize = {}));
14
16
  var AvatarColor;
15
17
  (function (AvatarColor) {
@@ -34,24 +36,19 @@ const AvatarImage = [
34
36
  const AvatarRootSizes = {
35
37
  'xl': [
36
38
  // Box
37
- 'w-[80px]', 'h-[80px]',
38
- // Typography
39
- 'text-[32px]'],
39
+ 'w-[80px]', 'h-[80px]'],
40
40
  'l': [
41
41
  // Box
42
- 'w-[64px]', 'h-[64px]',
43
- // Typography
44
- 'text-[24px]'],
42
+ 'w-[64px]', 'h-[64px]'],
45
43
  'm': [
46
44
  // Box
47
- 'w-[40px]', 'h-[40px]',
48
- // Typography
49
- 'text-[16px]'],
45
+ 'w-[40px]', 'h-[40px]'],
50
46
  's': [
51
47
  // Box
52
- 'w-[32px]', 'h-[32px]',
53
- // Typography
54
- 'text-[16px]']
48
+ 'w-[32px]', 'h-[32px]'],
49
+ 'xs': [
50
+ // Box
51
+ 'w-[24px]', 'h-[24px]']
55
52
  };
56
53
  const AvatarRootColors = {
57
54
  [AvatarColor.blue]: [
@@ -73,9 +70,26 @@ const AvatarRootColors = {
73
70
  // Theme
74
71
  'text-white', 'dark:text-overlay-dark']
75
72
  };
73
+ const AvatarRootAbbreviationSizes = {
74
+ 'xl': ['typography-headline-1'],
75
+ 'l': ['typography-headline-1'],
76
+ 'm': ['typography-body-1-bold'],
77
+ 's': ['typography-body-1-bold'],
78
+ 'xs': ['typography-caption-semibold']
79
+ };
80
+ const AvatarRootIconSizes = {
81
+ 'xl': ['text-[40px]'],
82
+ 'l': ['text-[32px]'],
83
+ 'm': ['text-[20px]'],
84
+ 's': ['text-[16px]'],
85
+ 'xs': ['text-[16px]']
86
+ };
76
87
 
77
88
  var script = defineComponent({
78
89
  name: 'OrAvatar',
90
+ components: {
91
+ OrIcon
92
+ },
79
93
  inheritAttrs: false,
80
94
  props: {
81
95
  src: {
@@ -86,6 +100,10 @@ var script = defineComponent({
86
100
  type: String,
87
101
  default: AvatarSize.M
88
102
  },
103
+ icon: {
104
+ type: String,
105
+ default: undefined
106
+ },
89
107
  color: {
90
108
  type: String,
91
109
  default: AvatarColor.auto,
@@ -101,9 +119,12 @@ var script = defineComponent({
101
119
  setup(props) {
102
120
  // Refs
103
121
  const root = ref();
122
+ const isIcon = computed(() => {
123
+ return !props.icon;
124
+ });
104
125
  // Styles
105
126
  const classAttribute = useClassAttribute();
106
- const rootStyles = computed(() => ['or-avatar', ...AvatarRoot, ...AvatarRootSizes[props.size], ...AvatarRootColors[props.color], classAttribute.value]);
127
+ const rootStyles = computed(() => ['or-avatar', ...AvatarRoot, ...AvatarRootSizes[props.size], ...AvatarRootColors[props.color], ...(isIcon.value ? AvatarRootAbbreviationSizes[props.size] : AvatarRootIconSizes[props.size]), classAttribute.value]);
107
128
  const imageStyles = computed(() => [...AvatarImage]);
108
129
  // Effects
109
130
  watchPostEffect(() => {
@@ -136,13 +157,18 @@ var __vue_render__ = function () {
136
157
  ref: "root",
137
158
  class: _vm.rootStyles
138
159
  }, 'div', _vm.$attrs, false), [_vm._t("default", function () {
139
- return [_c('img', {
160
+ return [_vm.src ? _c('img', {
140
161
  class: _vm.imageStyles,
141
162
  attrs: {
142
163
  "src": _vm.src,
143
164
  "alt": ''
144
165
  }
145
- })];
166
+ }) : _vm.icon ? _c('or-icon', {
167
+ attrs: {
168
+ "icon": _vm.icon,
169
+ "size": "inherit"
170
+ }
171
+ }) : _vm._e()];
146
172
  })], 2);
147
173
  };
148
174
  var __vue_staticRenderFns__ = [];
@@ -67,6 +67,6 @@ const __vue_component__ = /*#__PURE__*/normalizeComponent({
67
67
  render: __vue_render__,
68
68
  staticRenderFns: __vue_staticRenderFns__
69
69
  }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
70
- var __vue_component__$1 = __vue_component__;
70
+ var OrCard = __vue_component__;
71
71
 
72
- export { __vue_component__$1 as _ };
72
+ export { OrCard as O };
@@ -0,0 +1,228 @@
1
+ import './index-fa6eb4ca.js';
2
+ import { O as OrCard } from './OrCard-58a1ba3e.js';
3
+ import { O as OrIconButton } from './OrIconButton-a215104c.js';
4
+ import { O as OrInput } from './OrInput-8b90e08f.js';
5
+ import { O as OrSortHeader } from './OrSortHeader-396e6a7c.js';
6
+ import { u as useClassAttribute } from './useClassAttribute-9bf33346.js';
7
+ import { defineComponent, ref, computed, watch } from '@vue/composition-api/dist/vue-composition-api.mjs';
8
+ import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
9
+
10
+ var CardCollectionView;
11
+ (function (CardCollectionView) {
12
+ CardCollectionView["Grid"] = "grid";
13
+ CardCollectionView["List"] = "list";
14
+ })(CardCollectionView || (CardCollectionView = {}));
15
+
16
+ const CardCollectionRoot = [
17
+ // Layout
18
+ 'layout-column',
19
+ // Spacing
20
+ 'gap-md'];
21
+ const CardCollectionToolbar = [
22
+ // Layout
23
+ 'layout-row justify-between',
24
+ // Typography
25
+ 'typography-body-2-regular',
26
+ // Theme
27
+ 'theme-foreground-default', 'dark:theme-foreground-default-dark'];
28
+ const CardCollectionToolbarPanel = [
29
+ // Layout
30
+ 'layout-row',
31
+ // Spacing
32
+ 'gap-sm+'];
33
+ const CardCollectionContent = [
34
+ // Layout
35
+ 'grid',
36
+ // Spacing
37
+ 'gap-sm md:gap-md'];
38
+ const CardCollectionContentViews = {
39
+ 'grid': [
40
+ // Layout
41
+ 'sm:grid-cols-1', 'md:grid-cols-2', 'lg:grid-cols-4', 'xl:grid-cols-6'],
42
+ 'list': []
43
+ };
44
+
45
+ var script = defineComponent({
46
+ name: 'OrCardCollection',
47
+ components: {
48
+ OrCard,
49
+ OrIconButton,
50
+ OrInput,
51
+ OrSortHeader
52
+ },
53
+ inheritAttrs: false,
54
+ props: {
55
+ items: {
56
+ type: Array,
57
+ default: []
58
+ },
59
+ view: {
60
+ type: String,
61
+ default: CardCollectionView.Grid
62
+ },
63
+ sort: {
64
+ type: Object,
65
+ default: undefined
66
+ },
67
+ sortHeaders: {
68
+ type: Array,
69
+ default: undefined
70
+ },
71
+ search: {
72
+ type: String,
73
+ default: undefined
74
+ }
75
+ },
76
+ emits: ['viewChange', 'sortChange', 'searchChange'],
77
+ expose: ['root'],
78
+ setup(props, context) {
79
+ // Refs
80
+ const root = ref();
81
+ // Styles
82
+ const classAttribute = useClassAttribute();
83
+ const rootStyles = computed(() => ['or-card-collection', ...CardCollectionRoot, classAttribute.value]);
84
+ const toolbarStyles = computed(() => [...CardCollectionToolbar]);
85
+ const toolbarPanelStyles = computed(() => [...CardCollectionToolbarPanel]);
86
+ const contentStyles = computed(() => [...CardCollectionContent, ...CardCollectionContentViews[proxyView.value]]);
87
+ // State
88
+ const proxyView = ref(props.view);
89
+ const proxySort = ref(props.sort);
90
+ const proxySearch = ref(props.search);
91
+ // Methods
92
+ function switchToGridView() {
93
+ proxyView.value = CardCollectionView.Grid;
94
+ }
95
+ function switchToListView() {
96
+ proxyView.value = CardCollectionView.List;
97
+ }
98
+ // Effects
99
+ watch(() => props.view, value => {
100
+ proxyView.value = value;
101
+ });
102
+ watch(proxyView, value => {
103
+ context.emit('viewChange', value);
104
+ });
105
+ watch(() => props.sort, value => {
106
+ proxySort.value = value;
107
+ });
108
+ watch(proxySort, value => {
109
+ context.emit('sortChange', value);
110
+ });
111
+ watch(() => props.search, value => {
112
+ proxySearch.value = value;
113
+ });
114
+ watch(proxySearch, value => {
115
+ context.emit('searchChange', value);
116
+ });
117
+ return {
118
+ root,
119
+ rootStyles,
120
+ toolbarStyles,
121
+ toolbarPanelStyles,
122
+ contentStyles,
123
+ proxyView,
124
+ proxySort,
125
+ proxySearch,
126
+ switchToGridView,
127
+ switchToListView
128
+ };
129
+ }
130
+ });
131
+
132
+ /* script */
133
+ const __vue_script__ = script;
134
+
135
+ /* template */
136
+ var __vue_render__ = function () {
137
+ var _vm = this;
138
+ var _h = _vm.$createElement;
139
+ var _c = _vm._self._c || _h;
140
+ return _c('div', _vm._b({
141
+ ref: "root",
142
+ class: _vm.rootStyles
143
+ }, 'div', _vm.$attrs, false), [_c('div', {
144
+ class: _vm.toolbarStyles
145
+ }, [_c('div', {
146
+ class: _vm.toolbarPanelStyles
147
+ }, [_vm.sortHeaders ? _vm._l(_vm.sortHeaders, function (header) {
148
+ return _c('OrSortHeader', {
149
+ key: header.value,
150
+ attrs: {
151
+ "input-value": header.value
152
+ },
153
+ model: {
154
+ value: _vm.proxySort,
155
+ callback: function ($$v) {
156
+ _vm.proxySort = $$v;
157
+ },
158
+ expression: "proxySort"
159
+ }
160
+ }, [_vm._v("\n " + _vm._s(header.label) + "\n ")]);
161
+ }) : _vm._e()], 2), _vm._v(" "), _c('div', {
162
+ class: _vm.toolbarPanelStyles
163
+ }, [_c('OrInput', {
164
+ attrs: {
165
+ "type": 'search',
166
+ "placeholder": 'Search',
167
+ "size": 's'
168
+ },
169
+ model: {
170
+ value: _vm.proxySearch,
171
+ callback: function ($$v) {
172
+ _vm.proxySearch = $$v;
173
+ },
174
+ expression: "proxySearch"
175
+ }
176
+ }), _vm._v(" "), _c('OrIconButton', {
177
+ attrs: {
178
+ "icon": 'grid_view'
179
+ },
180
+ on: {
181
+ "click": function ($event) {
182
+ return _vm.switchToGridView();
183
+ }
184
+ }
185
+ }), _vm._v(" "), _c('OrIconButton', {
186
+ attrs: {
187
+ "icon": 'view_list'
188
+ },
189
+ on: {
190
+ "click": function ($event) {
191
+ return _vm.switchToListView();
192
+ }
193
+ }
194
+ }), _vm._v(" "), _vm._t("addon")], 2)]), _vm._v(" "), _c('div', {
195
+ class: _vm.contentStyles
196
+ }, [_vm.proxyView === 'grid' ? _vm._l(_vm.items, function (item) {
197
+ return _c('OrCard', {
198
+ key: item.id
199
+ }, [_vm._t("gridItem", null, null, item)], 2);
200
+ }) : _vm._e(), _vm._v(" "), _vm.proxyView === 'list' ? _vm._l(_vm.items, function (item) {
201
+ return _c('OrCard', {
202
+ key: item.id
203
+ }, [_vm._t("listItem", null, null, item)], 2);
204
+ }) : _vm._e()], 2)]);
205
+ };
206
+ var __vue_staticRenderFns__ = [];
207
+
208
+ /* style */
209
+ const __vue_inject_styles__ = undefined;
210
+ /* scoped */
211
+ const __vue_scope_id__ = undefined;
212
+ /* module identifier */
213
+ const __vue_module_identifier__ = undefined;
214
+ /* functional template */
215
+ const __vue_is_functional_template__ = false;
216
+ /* style inject */
217
+
218
+ /* style inject SSR */
219
+
220
+ /* style inject shadow dom */
221
+
222
+ const __vue_component__ = /*#__PURE__*/normalizeComponent({
223
+ render: __vue_render__,
224
+ staticRenderFns: __vue_staticRenderFns__
225
+ }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
226
+ var __vue_component__$1 = __vue_component__;
227
+
228
+ export { CardCollectionView as C, __vue_component__$1 as _ };
@@ -13,11 +13,6 @@ var script = defineComponent({
13
13
  },
14
14
  inheritAttrs: false,
15
15
  props: {
16
- modelValue: {
17
- type: String,
18
- default: '',
19
- required: false
20
- },
21
16
  size: {
22
17
  type: String,
23
18
  default: InputBoxSize.M
@@ -42,14 +37,13 @@ var script = defineComponent({
42
37
  emits: ['search', 'input', 'keydown', 'keyup', 'focus', 'blur', 'clear'],
43
38
  expose: ['root', 'focus', 'clear'],
44
39
  setup(props, context) {
45
- var _a;
46
40
  // Refs
47
41
  const root = ref();
48
42
  // Styles
49
43
  const classAttribute = useClassAttribute();
50
44
  const rootStyles = computed(() => ['or-search', classAttribute.value]);
51
45
  // State
52
- const localModelValue = ref((_a = props.modelValue) !== null && _a !== void 0 ? _a : '');
46
+ const localModelValue = ref('');
53
47
  // Events
54
48
  debouncedWatch(localModelValue, () => context.emit('search', localModelValue.value), {
55
49
  debounce: props.debounce
@@ -143,6 +137,6 @@ const __vue_component__ = /*#__PURE__*/normalizeComponent({
143
137
  render: __vue_render__,
144
138
  staticRenderFns: __vue_staticRenderFns__
145
139
  }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
146
- var OrSearch = __vue_component__;
140
+ var __vue_component__$1 = __vue_component__;
147
141
 
148
- export { OrSearch as O };
142
+ export { __vue_component__$1 as _ };
@@ -129,6 +129,6 @@ const __vue_component__ = /*#__PURE__*/normalizeComponent({
129
129
  render: __vue_render__,
130
130
  staticRenderFns: __vue_staticRenderFns__
131
131
  }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
132
- var __vue_component__$1 = __vue_component__;
132
+ var OrSortHeader = __vue_component__;
133
133
 
134
- export { __vue_component__$1 as _ };
134
+ export { OrSortHeader as O };
@@ -1,5 +1,5 @@
1
1
  export { O as OR_AVATAR_SIZE, _ as OrAvatar } from '../OrAvatar-0a2c265f.js';
2
- export { a as AvatarColor, A as AvatarSize, _ as OrAvatarV3 } from '../OrAvatar-2fa559e1.js';
2
+ export { a as AvatarColor, A as AvatarSize, _ as OrAvatarV3 } from '../OrAvatar-ae61bfb9.js';
3
3
  export { O as OrBottomSheetV3 } from '../OrBottomSheet-1cd1ab4c.js';
4
4
  export { _ as OrButton, a as OrButtonColors, b as OrButtonSizes, O as OrButtonViews } from '../OrButton-2abd29d0.js';
5
5
  export { O as OrButtonV2 } from '../OrButton-705cd0bd.js';
@@ -8,8 +8,8 @@ export { a as BUTTON_COLOR, c as BUTTON_LOADER_TYPE, b as BUTTON_SIZE, B as BUTT
8
8
  export { a as ButtonColor, b as ButtonType, B as ButtonVariant, O as OrButtonV3 } from '../OrButton-0e91a808.js';
9
9
  export { O as OrCard } from '../OrCard-a6b30f8f.js';
10
10
  export { C as CARD_COLLECTION_LAYOUT, _ as OrCardCollection } from '../OrCardCollection-89428bbf.js';
11
- export { D as DefaultCardCollectionViews, _ as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-773ae0db.js';
12
- export { _ as OrCardV3 } from '../OrCard-29116e1f.js';
11
+ export { C as CardCollectionView, _ as OrCardCollectionV3 } from '../OrCardCollection-a9a779ea.js';
12
+ export { O as OrCardV3 } from '../OrCard-58a1ba3e.js';
13
13
  export { a as OrCarousel, _ as OrCarouselItem } from '../OrCarouselItem-6da755c0.js';
14
14
  export { O as OrCheckbox } from '../OrCheckbox-4cbddd67.js';
15
15
  export { O as OrCheckboxV3 } from '../OrCheckbox-dbef9f9a.js';
@@ -63,7 +63,7 @@ export { _ as OrProgressV3, P as ProgressColor, a as ProgressType } from '../OrP
63
63
  export { _ as OrRadio } from '../OrRadio-187d6fc7.js';
64
64
  export { _ as OrRadioGroup } from '../OrRadioGroup-aa9f0757.js';
65
65
  export { _ as OrRadioV3 } from '../OrRadio-cd39b20b.js';
66
- export { O as OrSearchV3 } from '../OrSearch-a11b3621.js';
66
+ export { _ as OrSearchV3 } from '../OrSearch-9d402f56.js';
67
67
  export { _ as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl-21cc914e.js';
68
68
  export { _ as OrSelect } from '../OrSelect-a23d4210.js';
69
69
  export { _ as OrSelectV3 } from '../OrSelect-b20a9be0.js';
@@ -72,7 +72,7 @@ export { O as OrSidebarPlacement, _ as OrSidebarV3 } from '../OrSidebar-c95ef614
72
72
  export { _ as OrSkeletonCircle, a as OrSkeletonRect, b as OrSkeletonText, O as OrSkeletonTextSizes } from '../OrSkeletonText-242d22f3.js';
73
73
  export { _ as OrSkeletonCircleV3, a as OrSkeletonRectV3, b as OrSkeletonTextV3 } from '../OrSkeletonText-516993b4.js';
74
74
  export { _ as OrSlider } from '../OrSlider-59d05856.js';
75
- export { _ as OrSortHeaderV3 } from '../OrSortHeader-9932d28f.js';
75
+ export { O as OrSortHeaderV3 } from '../OrSortHeader-396e6a7c.js';
76
76
  export { _ as OrStepper } from '../OrStepper-3fc1a2b3.js';
77
77
  export { _ as OrSwitch } from '../OrSwitch-47670dbd.js';
78
78
  export { _ as OrSwitchV3 } from '../OrSwitch-237a2081.js';
@@ -20,7 +20,7 @@ export declare const WithTextInSlot: StoryFn<import("vue").ComponentOptions<impo
20
20
  } | string[], {} & {}, {
21
21
  [x: number]: string;
22
22
  } | {}, true>)>;
23
- export declare const WithIconInSlot: 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, {
23
+ export declare const WithIcon: 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, {
24
24
  [x: string]: ((...args: any[]) => any) | null;
25
25
  } | string[], {} & {}, {
26
26
  [x: number]: string;
@@ -13,6 +13,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
13
13
  type: PropType<AvatarSize>;
14
14
  default: AvatarSize;
15
15
  };
16
+ icon: {
17
+ type: StringConstructor;
18
+ default: undefined;
19
+ };
16
20
  color: {
17
21
  type: PropType<AvatarColor>;
18
22
  default: AvatarColor;
@@ -32,6 +36,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
32
36
  type: PropType<AvatarSize>;
33
37
  default: AvatarSize;
34
38
  };
39
+ icon: {
40
+ type: StringConstructor;
41
+ default: undefined;
42
+ };
35
43
  color: {
36
44
  type: PropType<AvatarColor>;
37
45
  default: AvatarColor;
@@ -45,6 +53,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
45
53
  }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
46
54
  src: string;
47
55
  size: AvatarSize;
56
+ icon: string;
48
57
  color: AvatarColor;
49
58
  colorSalt: string;
50
59
  } & {}, import("@vue/composition-api").ShallowUnwrapRef<{
@@ -54,11 +63,13 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
54
63
  }>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
55
64
  src: string;
56
65
  size: AvatarSize;
66
+ icon: string;
57
67
  color: AvatarColor;
58
68
  colorSalt: string;
59
69
  } & {}, {
60
70
  src: string;
61
71
  size: AvatarSize;
72
+ icon: string;
62
73
  color: AvatarColor;
63
74
  colorSalt: string;
64
75
  }, true>);
@@ -1,7 +1,8 @@
1
- export { a as AvatarColor, A as AvatarSize, _ as OrAvatarV3 } from '../../OrAvatar-2fa559e1.js';
1
+ export { a as AvatarColor, A as AvatarSize, _ as OrAvatarV3 } from '../../OrAvatar-ae61bfb9.js';
2
2
  import '../../index-fa6eb4ca.js';
3
3
  import 'vue';
4
4
  import '@vue/composition-api/dist/vue-composition-api.mjs';
5
5
  import '../../color-1f348774.js';
6
+ import '../../OrIcon-8625385f.js';
6
7
  import '../../useClassAttribute-9bf33346.js';
7
8
  import '../../normalize-component-6e8e3d80.js';
@@ -2,7 +2,8 @@ export declare enum AvatarSize {
2
2
  XL = "xl",
3
3
  L = "l",
4
4
  M = "m",
5
- S = "s"
5
+ S = "s",
6
+ XS = "xs"
6
7
  }
7
8
  export declare enum AvatarColor {
8
9
  blue = "blue",
@@ -3,3 +3,5 @@ export declare const AvatarRoot: string[];
3
3
  export declare const AvatarImage: string[];
4
4
  export declare const AvatarRootSizes: Record<AvatarSize, string[]>;
5
5
  export declare const AvatarRootColors: Record<AvatarColor, string[]>;
6
+ export declare const AvatarRootAbbreviationSizes: Record<AvatarSize, string[]>;
7
+ export declare const AvatarRootIconSizes: Record<AvatarSize, string[]>;
@@ -1,5 +1,4 @@
1
1
  import { Meta, StoryFn } from '@storybook/vue3';
2
- import OrCardCollection from './OrCardCollection.vue';
3
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, {
4
3
  [x: string]: ((...args: any[]) => any) | null;
5
4
  } | string[], {} & {}, {
@@ -16,7 +15,3 @@ export declare const WithSorting: StoryFn<import("vue").ComponentOptions<import(
16
15
  } | string[], {} & {}, {
17
16
  [x: number]: string;
18
17
  } | {}, true>)>;
19
- export declare const OverrideViewContainer: StoryFn<typeof OrCardCollection>;
20
- export declare const ExtraViewMode: StoryFn<typeof OrCardCollection>;
21
- export declare const WithLink: StoryFn<typeof OrCardCollection>;
22
- export declare const EmptySearchResults: StoryFn<typeof OrCardCollection>;