@onereach/ui-components 2.69.5-beta.2146.0 → 2.69.6-beta.2148.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundled/v2/{OrCardCollection-f622df47.js → OrCardCollection-c4209a92.js} +13 -9
- package/dist/bundled/v2/OrEmptyState-9fb413f9.js +160 -0
- package/dist/bundled/v2/{OrSearch-a11b3621.js → OrSearch-76b002cf.js} +1 -1
- package/dist/bundled/v2/components/index.d.ts +1 -0
- package/dist/bundled/v2/components/index.js +3 -2
- package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +5 -0
- package/dist/bundled/v2/components/or-card-collection-v3/OrCardCollection.vue.d.ts +22 -0
- package/dist/bundled/v2/components/or-card-collection-v3/index.js +2 -2
- package/dist/bundled/v2/components/or-empty-state-v3/OrEmptyState.vue.d.ts +1 -1
- package/dist/bundled/v2/components/or-empty-state-v3/index.js +3 -159
- package/dist/bundled/v2/components/or-input-box-v3/OrInputBox.vue.d.ts +1 -2
- package/dist/bundled/v2/components/or-search-v3/OrSearch.vue.d.ts +2 -2
- package/dist/bundled/v2/components/or-search-v3/index.js +1 -1
- package/dist/bundled/v2/index.js +4 -3
- package/dist/bundled/v3/{OrCardCollection.vue_vue_type_script_lang-15645a65.js → OrCardCollection.vue_vue_type_script_lang-9a2ae9a3.js} +10 -2
- package/dist/bundled/v3/OrEmptyState.vue_vue_type_script_lang-da7d6c42.js +111 -0
- package/dist/bundled/v3/{OrSearch.vue_vue_type_script_lang-0ae8a6dd.js → OrSearch.vue_vue_type_script_lang-014ad470.js} +1 -1
- package/dist/bundled/v3/components/index.d.ts +1 -0
- package/dist/bundled/v3/components/index.js +3 -2
- package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +5 -0
- package/dist/bundled/v3/components/or-card-collection-v3/OrCardCollection.vue.d.ts +22 -0
- package/dist/bundled/v3/components/or-card-collection-v3/index.js +2 -2
- package/dist/bundled/v3/components/or-empty-state-v3/OrEmptyState.vue.d.ts +1 -1
- package/dist/bundled/v3/components/or-empty-state-v3/index.js +2 -134
- package/dist/bundled/v3/components/or-input-box-v3/OrInputBox.vue.d.ts +1 -2
- package/dist/bundled/v3/components/or-search-v3/OrSearch.vue.d.ts +2 -2
- package/dist/bundled/v3/components/or-search-v3/index.js +1 -1
- package/dist/bundled/v3/index.js +219 -193
- package/dist/esm/v2/{OrCardCollection-43aa4a3c.js → OrCardCollection-57d11adf.js} +13 -9
- package/dist/esm/v2/OrEmptyState-2481f13f.js +158 -0
- package/dist/esm/v2/{OrSearch-62d91301.js → OrSearch-2f260b09.js} +1 -1
- package/dist/esm/v2/components/index.d.ts +1 -0
- package/dist/esm/v2/components/index.js +3 -2
- package/dist/esm/v2/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +5 -0
- package/dist/esm/v2/components/or-card-collection-v3/OrCardCollection.vue.d.ts +22 -0
- package/dist/esm/v2/components/or-card-collection-v3/index.js +2 -2
- package/dist/esm/v2/components/or-empty-state-v3/OrEmptyState.vue.d.ts +1 -1
- package/dist/esm/v2/components/or-empty-state-v3/index.js +3 -158
- package/dist/esm/v2/components/or-input-box-v3/OrInputBox.vue.d.ts +1 -2
- package/dist/esm/v2/components/or-search-v3/OrSearch.vue.d.ts +2 -2
- package/dist/esm/v2/components/or-search-v3/index.js +1 -1
- package/dist/esm/v2/index.js +3 -2
- package/dist/esm/v3/{OrCardCollection-6b5e6b76.js → OrCardCollection-2a6514f3.js} +15 -6
- package/dist/esm/v3/OrEmptyState-bb8e3145.js +135 -0
- package/dist/esm/v3/OrInput-41691fb3.js +1 -1
- package/dist/esm/v3/{OrInputBox-5247ab25.js → OrInputBox-6d1b6059.js} +1 -1
- package/dist/esm/v3/{OrSearch-aafb93b4.js → OrSearch-e5a2e93e.js} +2 -2
- package/dist/esm/v3/OrSelect-7e813982.js +1 -1
- package/dist/esm/v3/OrTextarea-bb9ef3f2.js +1 -1
- package/dist/esm/v3/components/index.d.ts +1 -0
- package/dist/esm/v3/components/index.js +4 -3
- package/dist/esm/v3/components/or-card-collection-v3/OrCardCollection.stories3.d.ts +5 -0
- package/dist/esm/v3/components/or-card-collection-v3/OrCardCollection.vue.d.ts +22 -0
- package/dist/esm/v3/components/or-card-collection-v3/index.js +3 -3
- package/dist/esm/v3/components/or-confirm-v3/index.js +1 -1
- package/dist/esm/v3/components/or-empty-state-v3/OrEmptyState.vue.d.ts +1 -1
- package/dist/esm/v3/components/or-empty-state-v3/index.js +3 -135
- package/dist/esm/v3/components/or-input-box-v3/OrInputBox.vue.d.ts +1 -2
- package/dist/esm/v3/components/or-input-box-v3/index.js +2 -2
- package/dist/esm/v3/components/or-input-v3/index.js +1 -1
- package/dist/esm/v3/components/or-search-v3/OrSearch.vue.d.ts +2 -2
- package/dist/esm/v3/components/or-search-v3/index.js +2 -2
- package/dist/esm/v3/components/or-select-v3/index.js +1 -1
- package/dist/esm/v3/components/or-textarea-v3/index.js +1 -1
- package/dist/esm/v3/index.js +4 -3
- package/package.json +1 -1
- package/src/components/index.ts +1 -0
- package/src/components/or-card/OrCard.stories.ts +1 -1
- package/src/components/or-card-collection/OrCardCollection.stories.ts +1 -1
- package/src/components/or-card-collection-v3/OrCardCollection.stories3.ts +16 -0
- package/src/components/or-card-collection-v3/OrCardCollection.vue +13 -1
- package/src/components/or-card-collection-v3/styles.ts +3 -1
- package/src/components/or-empty-state-v3/OrEmptyState.vue +16 -10
- package/src/components/or-input-box-v3/OrInputBox.vue +1 -2
- package/src/components/or-search-v3/OrSearch.stories3.ts +1 -1
- package/src/components/or-search-v3/OrSearch.vue +1 -1
- package/src/components/or-teleport-v3/OrTeleport.stories3.ts +1 -1
|
@@ -7,7 +7,7 @@ import { s as script$5 } from './OrMenu.vue_vue_type_script_lang-2446a69a.js';
|
|
|
7
7
|
import './OrMenuItem-4feaba6c.js';
|
|
8
8
|
import { s as script$6 } from './OrMenuItem.vue_vue_type_script_lang-0ffaef05.js';
|
|
9
9
|
import './OrIcon-d878b768.js';
|
|
10
|
-
import { s as script$2 } from './OrSearch.vue_vue_type_script_lang-
|
|
10
|
+
import { s as script$2 } from './OrSearch.vue_vue_type_script_lang-014ad470.js';
|
|
11
11
|
import { u as useClassAttribute } from './useClassAttribute-00888f78.js';
|
|
12
12
|
import { s as script$4 } from './OrButton.vue_vue_type_script_lang-b0dc31ca.js';
|
|
13
13
|
import { s as script$7 } from './OrIcon.vue_vue_type_script_lang-a119a715.js';
|
|
@@ -38,7 +38,7 @@ const CardCollectionContentViews = {
|
|
|
38
38
|
'grid': [
|
|
39
39
|
// Layout
|
|
40
40
|
'sm:grid-cols-1', 'md:grid-cols-2', 'lg:grid-cols-4', 'xl:grid-cols-6'],
|
|
41
|
-
'list': []
|
|
41
|
+
'list': ['grid-cols-1']
|
|
42
42
|
};
|
|
43
43
|
|
|
44
44
|
var script$1 = defineComponent({
|
|
@@ -156,6 +156,14 @@ var script = defineComponent({
|
|
|
156
156
|
search: {
|
|
157
157
|
type: String,
|
|
158
158
|
default: ''
|
|
159
|
+
},
|
|
160
|
+
searchPlaceholder: {
|
|
161
|
+
type: String,
|
|
162
|
+
default: undefined
|
|
163
|
+
},
|
|
164
|
+
searchDebounce: {
|
|
165
|
+
type: Number,
|
|
166
|
+
default: undefined
|
|
159
167
|
}
|
|
160
168
|
},
|
|
161
169
|
emits: ['viewChange', 'sortChange', 'searchChange'],
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import { defineComponent, ref, computed } from 'vue';
|
|
2
|
+
|
|
3
|
+
var EmptyStateSize;
|
|
4
|
+
(function (EmptyStateSize) {
|
|
5
|
+
EmptyStateSize["L"] = "l";
|
|
6
|
+
EmptyStateSize["M"] = "m";
|
|
7
|
+
})(EmptyStateSize || (EmptyStateSize = {}));
|
|
8
|
+
|
|
9
|
+
const EmptyStateRoot = [
|
|
10
|
+
// Layout
|
|
11
|
+
'grow', 'flex', 'flex-col', 'justify-center', 'items-center',
|
|
12
|
+
// Box
|
|
13
|
+
'w-full',
|
|
14
|
+
// Sizing
|
|
15
|
+
'gap-sm'];
|
|
16
|
+
const EmptyStateImage = [
|
|
17
|
+
// Sizing
|
|
18
|
+
'mb-sm'];
|
|
19
|
+
const EmptyStateImageSizes = {
|
|
20
|
+
[EmptyStateSize.L]: [
|
|
21
|
+
// Box
|
|
22
|
+
'h-3xl'],
|
|
23
|
+
[EmptyStateSize.M]: [
|
|
24
|
+
// Box
|
|
25
|
+
'h-2xl']
|
|
26
|
+
};
|
|
27
|
+
const EmptyStateHeading = [
|
|
28
|
+
// Theme
|
|
29
|
+
'theme-foreground-default', 'dark:theme-foreground-default-dark'];
|
|
30
|
+
const EmptyStateHeadingSizes = {
|
|
31
|
+
[EmptyStateSize.L]: [
|
|
32
|
+
// Typography
|
|
33
|
+
'typography-headline-2'],
|
|
34
|
+
[EmptyStateSize.M]: [
|
|
35
|
+
// Typography
|
|
36
|
+
'typography-headline-4']
|
|
37
|
+
};
|
|
38
|
+
const EmptyStateText = ['text-center',
|
|
39
|
+
// Theme
|
|
40
|
+
'text-outline', 'dark:text-outline-dark'];
|
|
41
|
+
const EmptyStateContent = EmptyStateText;
|
|
42
|
+
const EmptyStateTextSizes = {
|
|
43
|
+
[EmptyStateSize.L]: [
|
|
44
|
+
// Typography
|
|
45
|
+
'typography-body-2-regular'],
|
|
46
|
+
[EmptyStateSize.M]: [
|
|
47
|
+
// Typography
|
|
48
|
+
'typography-caption-regular']
|
|
49
|
+
};
|
|
50
|
+
const EmptyStateContentSizes = EmptyStateTextSizes;
|
|
51
|
+
|
|
52
|
+
/**
|
|
53
|
+
* The component to display when there is no content on a page,
|
|
54
|
+
* no records found or selected, or while the data is being loaded.
|
|
55
|
+
* Provides a hint to the user on what to do.
|
|
56
|
+
* Consists of text message, optional icon and optional loader.
|
|
57
|
+
*/
|
|
58
|
+
var script = defineComponent({
|
|
59
|
+
name: 'OrEmptyState',
|
|
60
|
+
props: {
|
|
61
|
+
/**
|
|
62
|
+
* Size of the component, affects font and icon size.
|
|
63
|
+
* Use Large if the component takes all screen space,
|
|
64
|
+
* and Medium if it is a part of the complex layout.
|
|
65
|
+
*/
|
|
66
|
+
size: {
|
|
67
|
+
type: String,
|
|
68
|
+
default: EmptyStateSize.M
|
|
69
|
+
},
|
|
70
|
+
/**
|
|
71
|
+
* The heading of the empty state block.
|
|
72
|
+
*/
|
|
73
|
+
heading: {
|
|
74
|
+
type: String,
|
|
75
|
+
default: ''
|
|
76
|
+
},
|
|
77
|
+
/**
|
|
78
|
+
* Additional text such as a hint for a user with proposed next steps.
|
|
79
|
+
*/
|
|
80
|
+
text: {
|
|
81
|
+
type: String,
|
|
82
|
+
default: ''
|
|
83
|
+
},
|
|
84
|
+
/**
|
|
85
|
+
* Path to the image to display above the heading.
|
|
86
|
+
* Image height is fixed depending on `size` prop, width is undefined to preserve aspect ratio.
|
|
87
|
+
*/
|
|
88
|
+
imageSrc: {
|
|
89
|
+
type: String,
|
|
90
|
+
default: undefined
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
setup(props) {
|
|
94
|
+
const root = ref();
|
|
95
|
+
const rootClasses = computed(() => ['or-empty-state', ...EmptyStateRoot]);
|
|
96
|
+
const imageClasses = computed(() => ['or-empty-state_image', ...EmptyStateImage, ...EmptyStateImageSizes[props.size]]);
|
|
97
|
+
const headingClasses = computed(() => ['or-empty-state_heading', ...EmptyStateHeading, ...EmptyStateHeadingSizes[props.size]]);
|
|
98
|
+
const textClasses = computed(() => ['or-empty-state_text', ...EmptyStateText, ...EmptyStateTextSizes[props.size]]);
|
|
99
|
+
const slotClasses = computed(() => ['or-empty-state_content', ...EmptyStateContent, ...EmptyStateContentSizes[props.size]]);
|
|
100
|
+
return {
|
|
101
|
+
root,
|
|
102
|
+
rootClasses,
|
|
103
|
+
imageClasses,
|
|
104
|
+
headingClasses,
|
|
105
|
+
textClasses,
|
|
106
|
+
slotClasses
|
|
107
|
+
};
|
|
108
|
+
}
|
|
109
|
+
});
|
|
110
|
+
|
|
111
|
+
export { EmptyStateSize as E, script as s };
|
|
@@ -21,6 +21,7 @@ export * from './or-date-time-picker';
|
|
|
21
21
|
export * from './or-error';
|
|
22
22
|
export * from './or-error-tag-v3';
|
|
23
23
|
export * from './or-error-v3';
|
|
24
|
+
export * from './or-empty-state-v3';
|
|
24
25
|
export * from './or-expansion-panel-v3';
|
|
25
26
|
export * from './or-fab-v3';
|
|
26
27
|
export * from './or-floating';
|
|
@@ -8,7 +8,7 @@ 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, s as OrButtonV3 } from '../OrButton.vue_vue_type_script_lang-b0dc31ca.js';
|
|
9
9
|
export { s as OrCard } from '../OrCard.vue_vue_type_script_lang-90ba001b.js';
|
|
10
10
|
export { C as CARD_COLLECTION_LAYOUT, s as OrCardCollection } from '../OrCardCollection.vue_vue_type_script_lang-d8124dda.js';
|
|
11
|
-
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection.vue_vue_type_script_lang-
|
|
11
|
+
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection.vue_vue_type_script_lang-9a2ae9a3.js';
|
|
12
12
|
export { s as OrCardV3 } from '../OrCard.vue_vue_type_script_lang-165de137.js';
|
|
13
13
|
export { a as OrCarousel, s as OrCarouselItem } from '../OrCarouselItem.vue_vue_type_script_lang-ad286afc.js';
|
|
14
14
|
export { s as OrCheckbox } from '../OrCheckbox.vue_vue_type_script_lang-d8a66818.js';
|
|
@@ -24,6 +24,7 @@ export { D as DEFAULT_TEXT, s as OrDateTimePicker, a as OrDateTimePickerItemType
|
|
|
24
24
|
export { s as OrError } from '../OrError.vue_vue_type_script_lang-7c39e012.js';
|
|
25
25
|
export { s as OrErrorTagV3 } from '../OrErrorTag.vue_vue_type_script_lang-4828c387.js';
|
|
26
26
|
export { s as OrErrorV3 } from '../OrError.vue_vue_type_script_lang-cc6c135f.js';
|
|
27
|
+
export { E as EmptyStateSize, s as OrEmptyStateV3 } from '../OrEmptyState.vue_vue_type_script_lang-da7d6c42.js';
|
|
27
28
|
export { a as ExpansionPanelColor, E as ExpansionPanelVariant, s as OrExpansionPanelV3 } from '../OrExpansionPanel.vue_vue_type_script_lang-7f9c6721.js';
|
|
28
29
|
export { F as FabColor, s as OrFabV3 } from '../OrFab.vue_vue_type_script_lang-2adeaed6.js';
|
|
29
30
|
export { s as OrFloating, a as OrFloatingHideStrategy, O as OrFloatingPlacements } from '../OrFloating.vue_vue_type_script_lang-8bf2b7ae.js';
|
|
@@ -63,7 +64,7 @@ export { s as OrProgressV3, P as ProgressColor, a as ProgressType } from '../OrP
|
|
|
63
64
|
export { s as OrRadio } from '../OrRadio.vue_vue_type_script_lang-c956b54b.js';
|
|
64
65
|
export { s as OrRadioGroup } from '../OrRadioGroup.vue_vue_type_script_lang-caea7bcb.js';
|
|
65
66
|
export { s as OrRadioV3 } from '../OrRadio.vue_vue_type_script_lang-2e666a56.js';
|
|
66
|
-
export { s as OrSearchV3 } from '../OrSearch.vue_vue_type_script_lang-
|
|
67
|
+
export { s as OrSearchV3 } from '../OrSearch.vue_vue_type_script_lang-014ad470.js';
|
|
67
68
|
export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl.vue_vue_type_script_lang-579406f5.js';
|
|
68
69
|
export { s as OrSelect } from '../OrSelect.vue_vue_type_script_lang-26c0a70a.js';
|
|
69
70
|
export { s as OrSelectV3 } from '../OrSelect.vue_vue_type_script_lang-15285ce4.js';
|
|
@@ -20,3 +20,8 @@ export declare const OverrideViewContainer: StoryFn<typeof OrCardCollection>;
|
|
|
20
20
|
export declare const ExtraViewMode: StoryFn<typeof OrCardCollection>;
|
|
21
21
|
export declare const WithLink: StoryFn<typeof OrCardCollection>;
|
|
22
22
|
export declare const EmptySearchResults: StoryFn<typeof OrCardCollection>;
|
|
23
|
+
export declare const CustomizeSearch: 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
|
+
[x: string]: ((...args: any[]) => any) | null;
|
|
25
|
+
} | string[], {} & {}, {
|
|
26
|
+
[x: number]: string;
|
|
27
|
+
} | {}, true>)>;
|
|
@@ -47,6 +47,14 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
47
47
|
type: StringConstructor;
|
|
48
48
|
default: string;
|
|
49
49
|
};
|
|
50
|
+
searchPlaceholder: {
|
|
51
|
+
type: StringConstructor;
|
|
52
|
+
default: undefined;
|
|
53
|
+
};
|
|
54
|
+
searchDebounce: {
|
|
55
|
+
type: NumberConstructor;
|
|
56
|
+
default: undefined;
|
|
57
|
+
};
|
|
50
58
|
}, import("@vue/composition-api").ExtractPropTypes<{
|
|
51
59
|
items: {
|
|
52
60
|
type: PropType<CardCollectionItem[]>;
|
|
@@ -72,6 +80,14 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
72
80
|
type: StringConstructor;
|
|
73
81
|
default: string;
|
|
74
82
|
};
|
|
83
|
+
searchPlaceholder: {
|
|
84
|
+
type: StringConstructor;
|
|
85
|
+
default: undefined;
|
|
86
|
+
};
|
|
87
|
+
searchDebounce: {
|
|
88
|
+
type: NumberConstructor;
|
|
89
|
+
default: undefined;
|
|
90
|
+
};
|
|
75
91
|
}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
|
|
76
92
|
search: string;
|
|
77
93
|
sort: string;
|
|
@@ -79,6 +95,8 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
79
95
|
view: string;
|
|
80
96
|
viewModes: ViewMode[];
|
|
81
97
|
sortOptions: SortOption[];
|
|
98
|
+
searchPlaceholder: string;
|
|
99
|
+
searchDebounce: number;
|
|
82
100
|
} & {} & {
|
|
83
101
|
[x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
|
|
84
102
|
}, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
@@ -110,6 +128,8 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
110
128
|
view: string;
|
|
111
129
|
viewModes: ViewMode[];
|
|
112
130
|
sortOptions: SortOption[];
|
|
131
|
+
searchPlaceholder: string;
|
|
132
|
+
searchDebounce: number;
|
|
113
133
|
} & {} & {
|
|
114
134
|
[x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
|
|
115
135
|
}, {
|
|
@@ -119,5 +139,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
119
139
|
view: string;
|
|
120
140
|
viewModes: ViewMode[];
|
|
121
141
|
sortOptions: SortOption[];
|
|
142
|
+
searchPlaceholder: string;
|
|
143
|
+
searchDebounce: number;
|
|
122
144
|
}, true>);
|
|
123
145
|
export default _default;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection.vue_vue_type_script_lang-
|
|
1
|
+
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection.vue_vue_type_script_lang-9a2ae9a3.js';
|
|
2
2
|
import 'vue';
|
|
3
3
|
import '../../OrIconButton-1581013c.js';
|
|
4
4
|
import '../../OrIconButton.vue_vue_type_script_lang-f6f801ff.js';
|
|
@@ -23,7 +23,7 @@ import '../../OrMenu-f26e8e55.js';
|
|
|
23
23
|
import '../../OrMenu.vue_vue_type_script_lang-2446a69a.js';
|
|
24
24
|
import '../../OrMenuItem-4feaba6c.js';
|
|
25
25
|
import '../../OrMenuItem.vue_vue_type_script_lang-0ffaef05.js';
|
|
26
|
-
import '../../OrSearch.vue_vue_type_script_lang-
|
|
26
|
+
import '../../OrSearch.vue_vue_type_script_lang-014ad470.js';
|
|
27
27
|
import '../../OrInput-fa782fc1.js';
|
|
28
28
|
import '../../OrInput.vue_vue_type_script_lang-f6d793d3.js';
|
|
29
29
|
import '../../OrHint-9592499e.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PropType } from 'vue-demi';
|
|
2
|
-
import { EmptyStateSize } from '
|
|
2
|
+
import { EmptyStateSize } from './props';
|
|
3
3
|
declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
4
4
|
root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
5
5
|
rootClasses: import("@vue/composition-api").ComputedRef<string[]>;
|
|
@@ -1,134 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var EmptyStateSize;
|
|
4
|
-
(function (EmptyStateSize) {
|
|
5
|
-
EmptyStateSize["L"] = "l";
|
|
6
|
-
EmptyStateSize["M"] = "m";
|
|
7
|
-
})(EmptyStateSize || (EmptyStateSize = {}));
|
|
8
|
-
|
|
9
|
-
const EmptyStateRoot = [
|
|
10
|
-
// Layout
|
|
11
|
-
'grow', 'flex', 'flex-col', 'justify-center', 'items-center',
|
|
12
|
-
// Box
|
|
13
|
-
'w-full',
|
|
14
|
-
// Sizing
|
|
15
|
-
'gap-sm'];
|
|
16
|
-
const EmptyStateImage = [
|
|
17
|
-
// Sizing
|
|
18
|
-
'mb-sm'];
|
|
19
|
-
const EmptyStateImageSizes = {
|
|
20
|
-
[EmptyStateSize.L]: [
|
|
21
|
-
// Box
|
|
22
|
-
'h-3xl'],
|
|
23
|
-
[EmptyStateSize.M]: [
|
|
24
|
-
// Box
|
|
25
|
-
'h-2xl']
|
|
26
|
-
};
|
|
27
|
-
const EmptyStateHeading = [
|
|
28
|
-
// Theme
|
|
29
|
-
'theme-foreground-default', 'dark:theme-foreground-default-dark'];
|
|
30
|
-
const EmptyStateHeadingSizes = {
|
|
31
|
-
[EmptyStateSize.L]: [
|
|
32
|
-
// Typography
|
|
33
|
-
'typography-headline-2'],
|
|
34
|
-
[EmptyStateSize.M]: [
|
|
35
|
-
// Typography
|
|
36
|
-
'typography-headline-4']
|
|
37
|
-
};
|
|
38
|
-
const EmptyStateText = ['text-center',
|
|
39
|
-
// Theme
|
|
40
|
-
'text-outline', 'dark:text-outline-dark'];
|
|
41
|
-
const EmptyStateContent = EmptyStateText;
|
|
42
|
-
const EmptyStateTextSizes = {
|
|
43
|
-
[EmptyStateSize.L]: [
|
|
44
|
-
// Typography
|
|
45
|
-
'typography-body-2-regular'],
|
|
46
|
-
[EmptyStateSize.M]: [
|
|
47
|
-
// Typography
|
|
48
|
-
'typography-caption-regular']
|
|
49
|
-
};
|
|
50
|
-
const EmptyStateContentSizes = EmptyStateTextSizes;
|
|
51
|
-
|
|
52
|
-
/**
|
|
53
|
-
* The component to display when there is no content on a page,
|
|
54
|
-
* no records found or selected, or while the data is being loaded.
|
|
55
|
-
* Provides a hint to the user on what to do.
|
|
56
|
-
* Consists of text message, optional icon and optional loader.
|
|
57
|
-
*/
|
|
58
|
-
var script = defineComponent({
|
|
59
|
-
name: 'OrEmptyState',
|
|
60
|
-
props: {
|
|
61
|
-
/**
|
|
62
|
-
* Size of the component, affects font and icon size.
|
|
63
|
-
* Use Large if the component takes all screen space,
|
|
64
|
-
* and Medium if it is a part of the complex layout.
|
|
65
|
-
*/
|
|
66
|
-
size: {
|
|
67
|
-
type: String,
|
|
68
|
-
default: EmptyStateSize.M
|
|
69
|
-
},
|
|
70
|
-
/**
|
|
71
|
-
* The heading of the empty state block.
|
|
72
|
-
*/
|
|
73
|
-
heading: {
|
|
74
|
-
type: String,
|
|
75
|
-
default: ''
|
|
76
|
-
},
|
|
77
|
-
/**
|
|
78
|
-
* Additional text such as a hint for a user with proposed next steps.
|
|
79
|
-
*/
|
|
80
|
-
text: {
|
|
81
|
-
type: String,
|
|
82
|
-
default: ''
|
|
83
|
-
},
|
|
84
|
-
/**
|
|
85
|
-
* Path to the image to display above the heading.
|
|
86
|
-
* Image height is fixed depending on `size` prop, width is undefined to preserve aspect ratio.
|
|
87
|
-
*/
|
|
88
|
-
imageSrc: {
|
|
89
|
-
type: String,
|
|
90
|
-
default: undefined
|
|
91
|
-
}
|
|
92
|
-
},
|
|
93
|
-
setup(props) {
|
|
94
|
-
const root = ref();
|
|
95
|
-
const rootClasses = computed(() => ['or-empty-state', ...EmptyStateRoot]);
|
|
96
|
-
const imageClasses = computed(() => ['or-empty-state_image', ...EmptyStateImage, ...EmptyStateImageSizes[props.size]]);
|
|
97
|
-
const headingClasses = computed(() => ['or-empty-state_heading', ...EmptyStateHeading, ...EmptyStateHeadingSizes[props.size]]);
|
|
98
|
-
const textClasses = computed(() => ['or-empty-state_text', ...EmptyStateText, ...EmptyStateTextSizes[props.size]]);
|
|
99
|
-
const slotClasses = computed(() => ['or-empty-state_content', ...EmptyStateContent, ...EmptyStateContentSizes[props.size]]);
|
|
100
|
-
return {
|
|
101
|
-
root,
|
|
102
|
-
rootClasses,
|
|
103
|
-
imageClasses,
|
|
104
|
-
headingClasses,
|
|
105
|
-
textClasses,
|
|
106
|
-
slotClasses
|
|
107
|
-
};
|
|
108
|
-
}
|
|
109
|
-
});
|
|
110
|
-
|
|
111
|
-
const _hoisted_1 = ["src"];
|
|
112
|
-
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
113
|
-
return openBlock(), createElementBlock("div", {
|
|
114
|
-
ref: "root",
|
|
115
|
-
class: normalizeClass(_ctx.rootClasses)
|
|
116
|
-
}, [_ctx.imageSrc ? (openBlock(), createElementBlock("img", {
|
|
117
|
-
key: 0,
|
|
118
|
-
src: _ctx.imageSrc,
|
|
119
|
-
class: normalizeClass(_ctx.imageClasses),
|
|
120
|
-
alt: ""
|
|
121
|
-
}, null, 10 /* CLASS, PROPS */, _hoisted_1)) : createCommentVNode("v-if", true), createElementVNode("div", {
|
|
122
|
-
class: normalizeClass(_ctx.headingClasses)
|
|
123
|
-
}, toDisplayString(_ctx.heading), 3 /* TEXT, CLASS */), _ctx.$slots.default ? (openBlock(), createElementBlock("div", {
|
|
124
|
-
key: 1,
|
|
125
|
-
class: normalizeClass(_ctx.slotClasses)
|
|
126
|
-
}, [createCommentVNode(" @slot Additional content can be inserted via default slot. The slot uses the same font as a `text` prop. "), renderSlot(_ctx.$slots, "default")], 2 /* CLASS */)) : createCommentVNode("v-if", true), createElementVNode("div", {
|
|
127
|
-
class: normalizeClass(_ctx.textClasses)
|
|
128
|
-
}, toDisplayString(_ctx.text), 3 /* TEXT, CLASS */)], 2 /* CLASS */);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
script.render = render;
|
|
132
|
-
script.__file = "src/components/or-empty-state-v3/OrEmptyState.vue";
|
|
133
|
-
|
|
134
|
-
export { EmptyStateSize, script as OrEmptyStateV3 };
|
|
1
|
+
export { E as EmptyStateSize, s as OrEmptyStateV3 } from '../../OrEmptyState.vue_vue_type_script_lang-da7d6c42.js';
|
|
2
|
+
import 'vue';
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { PropType } from 'vue-demi';
|
|
2
|
-
import { InputBoxVariant } from '
|
|
3
|
-
import { InputBoxSize } from './props';
|
|
2
|
+
import { InputBoxSize, InputBoxVariant } from './props';
|
|
4
3
|
declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
5
4
|
root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
6
5
|
rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
|
|
@@ -22,7 +22,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
22
22
|
};
|
|
23
23
|
placeholder: {
|
|
24
24
|
type: StringConstructor;
|
|
25
|
-
default:
|
|
25
|
+
default: string;
|
|
26
26
|
};
|
|
27
27
|
debounce: {
|
|
28
28
|
type: NumberConstructor;
|
|
@@ -48,7 +48,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
|
|
|
48
48
|
};
|
|
49
49
|
placeholder: {
|
|
50
50
|
type: StringConstructor;
|
|
51
|
-
default:
|
|
51
|
+
default: string;
|
|
52
52
|
};
|
|
53
53
|
debounce: {
|
|
54
54
|
type: NumberConstructor;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { s as OrSearchV3 } from '../../OrSearch.vue_vue_type_script_lang-
|
|
1
|
+
export { s as OrSearchV3 } from '../../OrSearch.vue_vue_type_script_lang-014ad470.js';
|
|
2
2
|
export { a as SearchSize } from '../../OrInputBox.vue_vue_type_script_lang-5ee4ee45.js';
|
|
3
3
|
import 'vue';
|
|
4
4
|
import '@vueuse/core';
|