vue-chrts 0.0.45 → 0.0.47
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/components/Area/Area.d.ts +24 -23
- package/dist/components/Area/index.d.ts +62 -0
- package/dist/index.cjs +317 -0
- package/dist/index.js +318 -0
- package/package.json +1 -1
- package/dist/vue-chrts.js +0 -2796
- package/dist/vue-chrts.umd.cjs +0 -54
|
@@ -1,30 +1,31 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { BaseChartProps } from '.';
|
|
2
|
+
import { BulletLegendItemInterface, CurveType } from '@unovis/ts';
|
|
3
|
+
import { Component } from 'vue';
|
|
3
4
|
|
|
4
|
-
declare const _default: <T
|
|
5
|
-
props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
5
|
+
declare const _default: <T extends Record<string, any>>(__VLS_props: Awaited<typeof __VLS_setup>["props"], __VLS_ctx?: __VLS_Prettify<Pick<Awaited<typeof __VLS_setup>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
6
|
+
props: __VLS_Prettify<__VLS_OmitKeepDiscriminatedUnion<(Partial<{}> & Omit<{
|
|
7
|
+
readonly onLegendItemClick?: ((d: BulletLegendItemInterface, i: number) => any) | undefined;
|
|
8
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>) & (BaseChartProps<T> & {
|
|
9
|
+
/**
|
|
10
|
+
* Render custom tooltip component.
|
|
11
|
+
*/
|
|
12
|
+
customTooltip?: Component;
|
|
13
|
+
/**
|
|
14
|
+
* Type of curve
|
|
15
|
+
*/
|
|
13
16
|
curveType?: CurveType;
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
gridLineY?: boolean;
|
|
21
|
-
domainLineY?: boolean;
|
|
22
|
-
paginationPoisition?: PaginationPosition;
|
|
23
|
-
}, keyof import('vue').VNodeProps | keyof import('vue').AllowedComponentProps>> & {} & (import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps);
|
|
17
|
+
/**
|
|
18
|
+
* Controls the visibility of gradient.
|
|
19
|
+
* @default true
|
|
20
|
+
*/
|
|
21
|
+
showGradiant?: boolean;
|
|
22
|
+
}), keyof import('vue').VNodeProps | keyof import('vue').AllowedComponentProps>> & {} & (import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps);
|
|
24
23
|
expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
|
|
25
24
|
attrs: any;
|
|
26
|
-
slots: ReturnType<() => {
|
|
27
|
-
|
|
25
|
+
slots: ReturnType<() => {
|
|
26
|
+
default?(_: {}): any;
|
|
27
|
+
}>;
|
|
28
|
+
emit: (evt: "legendItemClick", d: BulletLegendItemInterface, i: number) => void;
|
|
28
29
|
}>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
29
30
|
[key: string]: any;
|
|
30
31
|
}> & {
|
|
@@ -1,5 +1,67 @@
|
|
|
1
|
+
import { Spacing } from '@unovis/ts';
|
|
1
2
|
export { default as Area } from './Area.vue';
|
|
2
3
|
export declare enum PaginationPosition {
|
|
3
4
|
Top = "top",
|
|
4
5
|
Bottom = "bottom"
|
|
5
6
|
}
|
|
7
|
+
type KeyOf<T extends Record<string, any>> = Extract<keyof T, string>;
|
|
8
|
+
export interface BaseChartProps<T extends Record<string, any>> {
|
|
9
|
+
/**
|
|
10
|
+
* The source data, in which each entry is a dictionary.
|
|
11
|
+
*/
|
|
12
|
+
data: T[];
|
|
13
|
+
/**
|
|
14
|
+
* Select the categories from your data. Used to populate the legend and toolip.
|
|
15
|
+
*/
|
|
16
|
+
categories: KeyOf<T>[];
|
|
17
|
+
/**
|
|
18
|
+
* Sets the key to map the data to the axis.
|
|
19
|
+
*/
|
|
20
|
+
index: KeyOf<T>;
|
|
21
|
+
/**
|
|
22
|
+
* Change the default colors.
|
|
23
|
+
*/
|
|
24
|
+
colors?: string[];
|
|
25
|
+
/**
|
|
26
|
+
* Margin of each the container
|
|
27
|
+
*/
|
|
28
|
+
margin?: Spacing;
|
|
29
|
+
/**
|
|
30
|
+
* Change the opacity of the non-selected field
|
|
31
|
+
* @default 0.2
|
|
32
|
+
*/
|
|
33
|
+
filterOpacity?: number;
|
|
34
|
+
/**
|
|
35
|
+
* Function to format X label
|
|
36
|
+
*/
|
|
37
|
+
xFormatter?: (tick: number | Date, i: number, ticks: number[] | Date[]) => string;
|
|
38
|
+
/**
|
|
39
|
+
* Function to format Y label
|
|
40
|
+
*/
|
|
41
|
+
yFormatter?: (tick: number | Date, i: number, ticks: number[] | Date[]) => string;
|
|
42
|
+
/**
|
|
43
|
+
* Controls the visibility of the X axis.
|
|
44
|
+
* @default true
|
|
45
|
+
*/
|
|
46
|
+
showXAxis?: boolean;
|
|
47
|
+
/**
|
|
48
|
+
* Controls the visibility of the Y axis.
|
|
49
|
+
* @default true
|
|
50
|
+
*/
|
|
51
|
+
showYAxis?: boolean;
|
|
52
|
+
/**
|
|
53
|
+
* Controls the visibility of tooltip.
|
|
54
|
+
* @default true
|
|
55
|
+
*/
|
|
56
|
+
showTooltip?: boolean;
|
|
57
|
+
/**
|
|
58
|
+
* Controls the visibility of legend.
|
|
59
|
+
* @default true
|
|
60
|
+
*/
|
|
61
|
+
showLegend?: boolean;
|
|
62
|
+
/**
|
|
63
|
+
* Controls the visibility of gridline.
|
|
64
|
+
* @default true
|
|
65
|
+
*/
|
|
66
|
+
showGridLine?: boolean;
|
|
67
|
+
}
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,317 @@
|
|
|
1
|
+
(function(global, factory) {
|
|
2
|
+
typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("vue"), require("vue/server-renderer"), require("@unovis/ts"), require("@unovis/vue"), require("@vueuse/core")) : typeof define === "function" && define.amd ? define(["exports", "vue", "vue/server-renderer", "@unovis/ts", "@unovis/vue", "@vueuse/core"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global["vue-chrts"] = {}, global.Vue, global.serverRenderer, global.ts, global.vue$1, global.core));
|
|
3
|
+
})(this, function(exports2, vue, serverRenderer, ts, vue$1, core) {
|
|
4
|
+
"use strict";
|
|
5
|
+
const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
|
|
6
|
+
__name: "Area",
|
|
7
|
+
__ssrInlineRender: true,
|
|
8
|
+
props: {
|
|
9
|
+
data: {},
|
|
10
|
+
categories: {},
|
|
11
|
+
index: {},
|
|
12
|
+
colors: {},
|
|
13
|
+
margin: { default: () => ({ top: 0, bottom: 0, left: 0, right: 0 }) },
|
|
14
|
+
filterOpacity: { default: 0.2 },
|
|
15
|
+
xFormatter: {},
|
|
16
|
+
yFormatter: {},
|
|
17
|
+
showXAxis: { type: Boolean, default: true },
|
|
18
|
+
showYAxis: { type: Boolean, default: true },
|
|
19
|
+
showTooltip: { type: Boolean, default: true },
|
|
20
|
+
showLegend: { type: Boolean, default: true },
|
|
21
|
+
showGridLine: { type: Boolean, default: true },
|
|
22
|
+
customTooltip: {},
|
|
23
|
+
curveType: { default: ts.CurveType.MonotoneX },
|
|
24
|
+
showGradiant: { type: Boolean, default: true }
|
|
25
|
+
},
|
|
26
|
+
emits: ["legendItemClick"],
|
|
27
|
+
setup(__props, { emit: __emit }) {
|
|
28
|
+
function defaultColors(count = 3) {
|
|
29
|
+
const quotient = Math.floor(count / 2);
|
|
30
|
+
const remainder = count % 2;
|
|
31
|
+
const primaryCount = quotient + remainder;
|
|
32
|
+
const secondaryCount = quotient;
|
|
33
|
+
return [
|
|
34
|
+
...Array.from(new Array(primaryCount).keys()).map((i) => `hsl(var(--vis-primary-color) / ${1 - 1 / primaryCount * i})`),
|
|
35
|
+
...Array.from(new Array(secondaryCount).keys()).map((i) => `hsl(var(--vis-secondary-color) / ${1 - 1 / secondaryCount * i})`)
|
|
36
|
+
];
|
|
37
|
+
}
|
|
38
|
+
const props = __props;
|
|
39
|
+
const emits = __emit;
|
|
40
|
+
const index = vue.computed(() => props.index);
|
|
41
|
+
const colors = vue.computed(() => {
|
|
42
|
+
var _a;
|
|
43
|
+
return ((_a = props.colors) == null ? void 0 : _a.length) ? props.colors : defaultColors(props.categories.length);
|
|
44
|
+
});
|
|
45
|
+
const legendItems = vue.ref(props.categories.map((category, i) => ({
|
|
46
|
+
name: category,
|
|
47
|
+
color: colors.value[i],
|
|
48
|
+
inactive: false
|
|
49
|
+
})));
|
|
50
|
+
const isMounted = core.useMounted();
|
|
51
|
+
function handleLegendItemClick(d, i) {
|
|
52
|
+
emits("legendItemClick", d, i);
|
|
53
|
+
}
|
|
54
|
+
return (_ctx, _push, _parent, _attrs) => {
|
|
55
|
+
const _component_ChartLegend = vue.resolveComponent("ChartLegend");
|
|
56
|
+
const _component_ChartCrosshair = vue.resolveComponent("ChartCrosshair");
|
|
57
|
+
_push(`<div${serverRenderer.ssrRenderAttrs(vue.mergeProps({ class: "w-full h-[400px] flex flex-col items-end" }, _attrs))}>`);
|
|
58
|
+
if (_ctx.showLegend) {
|
|
59
|
+
_push(serverRenderer.ssrRenderComponent(_component_ChartLegend, {
|
|
60
|
+
items: legendItems.value,
|
|
61
|
+
"onUpdate:items": ($event) => legendItems.value = $event,
|
|
62
|
+
onLegendItemClick: handleLegendItemClick
|
|
63
|
+
}, null, _parent));
|
|
64
|
+
} else {
|
|
65
|
+
_push(`<!---->`);
|
|
66
|
+
}
|
|
67
|
+
_push(serverRenderer.ssrRenderComponent(vue.unref(vue$1.VisXYContainer), {
|
|
68
|
+
style: { height: vue.unref(isMounted) ? "100%" : "auto" },
|
|
69
|
+
margin: { left: 20, right: 20 },
|
|
70
|
+
data: _ctx.data
|
|
71
|
+
}, {
|
|
72
|
+
default: vue.withCtx((_, _push2, _parent2, _scopeId) => {
|
|
73
|
+
if (_push2) {
|
|
74
|
+
_push2(`<svg width="0" height="0"${_scopeId}><defs${_scopeId}><!--[-->`);
|
|
75
|
+
serverRenderer.ssrRenderList(colors.value, (color, i) => {
|
|
76
|
+
_push2(`<linearGradient x1="0" y1="0" x2="0" y2="1"${_scopeId}>`);
|
|
77
|
+
if (_ctx.showGradiant) {
|
|
78
|
+
_push2(`<!--[--><stop offset="5%"${serverRenderer.ssrRenderAttr("stop-color", color)} stop-opacity="0.4"${_scopeId}></stop><stop offset="95%"${serverRenderer.ssrRenderAttr("stop-color", color)} stop-opacity="0"${_scopeId}></stop><!--]-->`);
|
|
79
|
+
} else {
|
|
80
|
+
_push2(`<stop offset="0%"${serverRenderer.ssrRenderAttr("stop-color", color)}${_scopeId}></stop>`);
|
|
81
|
+
}
|
|
82
|
+
_push2(`</linearGradient>`);
|
|
83
|
+
});
|
|
84
|
+
_push2(`<!--]--></defs></svg>`);
|
|
85
|
+
if (_ctx.showTooltip) {
|
|
86
|
+
_push2(serverRenderer.ssrRenderComponent(_component_ChartCrosshair, {
|
|
87
|
+
colors: colors.value,
|
|
88
|
+
items: legendItems.value,
|
|
89
|
+
index: index.value,
|
|
90
|
+
"custom-tooltip": _ctx.customTooltip
|
|
91
|
+
}, null, _parent2, _scopeId));
|
|
92
|
+
} else {
|
|
93
|
+
_push2(`<!---->`);
|
|
94
|
+
}
|
|
95
|
+
_push2(`<!--[-->`);
|
|
96
|
+
serverRenderer.ssrRenderList(_ctx.categories, (category) => {
|
|
97
|
+
var _a;
|
|
98
|
+
_push2(serverRenderer.ssrRenderComponent(vue.unref(vue$1.VisArea), {
|
|
99
|
+
x: (_2, i) => i,
|
|
100
|
+
y: (d) => d[category],
|
|
101
|
+
color: "auto",
|
|
102
|
+
"curve-type": _ctx.curveType,
|
|
103
|
+
attributes: {
|
|
104
|
+
[vue.unref(ts.Area).selectors.area]: {
|
|
105
|
+
fill: ``
|
|
106
|
+
}
|
|
107
|
+
},
|
|
108
|
+
opacity: ((_a = legendItems.value.find((item) => item.name === category)) == null ? void 0 : _a.inactive) ? _ctx.filterOpacity : 1
|
|
109
|
+
}, null, _parent2, _scopeId));
|
|
110
|
+
});
|
|
111
|
+
_push2(`<!--]--><!--[-->`);
|
|
112
|
+
serverRenderer.ssrRenderList(_ctx.categories, (category, i) => {
|
|
113
|
+
var _a;
|
|
114
|
+
_push2(serverRenderer.ssrRenderComponent(vue.unref(vue$1.VisLine), {
|
|
115
|
+
x: (_2, i2) => i2,
|
|
116
|
+
y: (d) => d[category],
|
|
117
|
+
color: colors.value[i],
|
|
118
|
+
"curve-type": _ctx.curveType,
|
|
119
|
+
attributes: {
|
|
120
|
+
[vue.unref(ts.Line).selectors.line]: {
|
|
121
|
+
opacity: ((_a = legendItems.value.find((item) => item.name === category)) == null ? void 0 : _a.inactive) ? _ctx.filterOpacity : 1
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
}, null, _parent2, _scopeId));
|
|
125
|
+
});
|
|
126
|
+
_push2(`<!--]-->`);
|
|
127
|
+
if (_ctx.showXAxis) {
|
|
128
|
+
_push2(serverRenderer.ssrRenderComponent(vue.unref(vue$1.VisAxis), {
|
|
129
|
+
type: "x",
|
|
130
|
+
"tick-format": _ctx.xFormatter ?? ((v) => {
|
|
131
|
+
var _a;
|
|
132
|
+
return (_a = _ctx.data[v]) == null ? void 0 : _a[index.value];
|
|
133
|
+
}),
|
|
134
|
+
"grid-line": false,
|
|
135
|
+
"tick-line": false,
|
|
136
|
+
"tick-text-color": "hsl(var(--vis-text-color))"
|
|
137
|
+
}, null, _parent2, _scopeId));
|
|
138
|
+
} else {
|
|
139
|
+
_push2(`<!---->`);
|
|
140
|
+
}
|
|
141
|
+
if (_ctx.showYAxis) {
|
|
142
|
+
_push2(serverRenderer.ssrRenderComponent(vue.unref(vue$1.VisAxis), {
|
|
143
|
+
type: "y",
|
|
144
|
+
"tick-line": false,
|
|
145
|
+
"tick-format": _ctx.yFormatter,
|
|
146
|
+
"domain-line": false,
|
|
147
|
+
"grid-line": _ctx.showGridLine,
|
|
148
|
+
attributes: {
|
|
149
|
+
[vue.unref(ts.Axis).selectors.grid]: {
|
|
150
|
+
class: "text-muted"
|
|
151
|
+
}
|
|
152
|
+
},
|
|
153
|
+
"tick-text-color": "hsl(var(--vis-text-color))"
|
|
154
|
+
}, null, _parent2, _scopeId));
|
|
155
|
+
} else {
|
|
156
|
+
_push2(`<!---->`);
|
|
157
|
+
}
|
|
158
|
+
serverRenderer.ssrRenderSlot(_ctx.$slots, "default", {}, null, _push2, _parent2, _scopeId);
|
|
159
|
+
} else {
|
|
160
|
+
return [
|
|
161
|
+
(vue.openBlock(), vue.createBlock("svg", {
|
|
162
|
+
width: "0",
|
|
163
|
+
height: "0"
|
|
164
|
+
}, [
|
|
165
|
+
vue.createVNode("defs", null, [
|
|
166
|
+
(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(colors.value, (color, i) => {
|
|
167
|
+
return vue.openBlock(), vue.createBlock("linearGradient", {
|
|
168
|
+
key: i,
|
|
169
|
+
x1: "0",
|
|
170
|
+
y1: "0",
|
|
171
|
+
x2: "0",
|
|
172
|
+
y2: "1"
|
|
173
|
+
}, [
|
|
174
|
+
_ctx.showGradiant ? (vue.openBlock(), vue.createBlock(vue.Fragment, { key: 0 }, [
|
|
175
|
+
vue.createVNode("stop", {
|
|
176
|
+
offset: "5%",
|
|
177
|
+
"stop-color": color,
|
|
178
|
+
"stop-opacity": "0.4"
|
|
179
|
+
}, null, 8, ["stop-color"]),
|
|
180
|
+
vue.createVNode("stop", {
|
|
181
|
+
offset: "95%",
|
|
182
|
+
"stop-color": color,
|
|
183
|
+
"stop-opacity": "0"
|
|
184
|
+
}, null, 8, ["stop-color"])
|
|
185
|
+
], 64)) : (vue.openBlock(), vue.createBlock("stop", {
|
|
186
|
+
key: 1,
|
|
187
|
+
offset: "0%",
|
|
188
|
+
"stop-color": color
|
|
189
|
+
}, null, 8, ["stop-color"]))
|
|
190
|
+
]);
|
|
191
|
+
}), 128))
|
|
192
|
+
])
|
|
193
|
+
])),
|
|
194
|
+
_ctx.showTooltip ? (vue.openBlock(), vue.createBlock(_component_ChartCrosshair, {
|
|
195
|
+
key: 0,
|
|
196
|
+
colors: colors.value,
|
|
197
|
+
items: legendItems.value,
|
|
198
|
+
index: index.value,
|
|
199
|
+
"custom-tooltip": _ctx.customTooltip
|
|
200
|
+
}, null, 8, ["colors", "items", "index", "custom-tooltip"])) : vue.createCommentVNode("", true),
|
|
201
|
+
(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(_ctx.categories, (category) => {
|
|
202
|
+
var _a;
|
|
203
|
+
return vue.openBlock(), vue.createBlock(vue.unref(vue$1.VisArea), {
|
|
204
|
+
key: category,
|
|
205
|
+
x: (_2, i) => i,
|
|
206
|
+
y: (d) => d[category],
|
|
207
|
+
color: "auto",
|
|
208
|
+
"curve-type": _ctx.curveType,
|
|
209
|
+
attributes: {
|
|
210
|
+
[vue.unref(ts.Area).selectors.area]: {
|
|
211
|
+
fill: ``
|
|
212
|
+
}
|
|
213
|
+
},
|
|
214
|
+
opacity: ((_a = legendItems.value.find((item) => item.name === category)) == null ? void 0 : _a.inactive) ? _ctx.filterOpacity : 1
|
|
215
|
+
}, null, 8, ["x", "y", "curve-type", "attributes", "opacity"]);
|
|
216
|
+
}), 128)),
|
|
217
|
+
(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList(_ctx.categories, (category, i) => {
|
|
218
|
+
var _a;
|
|
219
|
+
return vue.openBlock(), vue.createBlock(vue.unref(vue$1.VisLine), {
|
|
220
|
+
key: category,
|
|
221
|
+
x: (_2, i2) => i2,
|
|
222
|
+
y: (d) => d[category],
|
|
223
|
+
color: colors.value[i],
|
|
224
|
+
"curve-type": _ctx.curveType,
|
|
225
|
+
attributes: {
|
|
226
|
+
[vue.unref(ts.Line).selectors.line]: {
|
|
227
|
+
opacity: ((_a = legendItems.value.find((item) => item.name === category)) == null ? void 0 : _a.inactive) ? _ctx.filterOpacity : 1
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
}, null, 8, ["x", "y", "color", "curve-type", "attributes"]);
|
|
231
|
+
}), 128)),
|
|
232
|
+
_ctx.showXAxis ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.VisAxis), {
|
|
233
|
+
key: 1,
|
|
234
|
+
type: "x",
|
|
235
|
+
"tick-format": _ctx.xFormatter ?? ((v) => {
|
|
236
|
+
var _a;
|
|
237
|
+
return (_a = _ctx.data[v]) == null ? void 0 : _a[index.value];
|
|
238
|
+
}),
|
|
239
|
+
"grid-line": false,
|
|
240
|
+
"tick-line": false,
|
|
241
|
+
"tick-text-color": "hsl(var(--vis-text-color))"
|
|
242
|
+
}, null, 8, ["tick-format"])) : vue.createCommentVNode("", true),
|
|
243
|
+
_ctx.showYAxis ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.VisAxis), {
|
|
244
|
+
key: 2,
|
|
245
|
+
type: "y",
|
|
246
|
+
"tick-line": false,
|
|
247
|
+
"tick-format": _ctx.yFormatter,
|
|
248
|
+
"domain-line": false,
|
|
249
|
+
"grid-line": _ctx.showGridLine,
|
|
250
|
+
attributes: {
|
|
251
|
+
[vue.unref(ts.Axis).selectors.grid]: {
|
|
252
|
+
class: "text-muted"
|
|
253
|
+
}
|
|
254
|
+
},
|
|
255
|
+
"tick-text-color": "hsl(var(--vis-text-color))"
|
|
256
|
+
}, null, 8, ["tick-format", "grid-line", "attributes"])) : vue.createCommentVNode("", true),
|
|
257
|
+
vue.renderSlot(_ctx.$slots, "default")
|
|
258
|
+
];
|
|
259
|
+
}
|
|
260
|
+
}),
|
|
261
|
+
_: 3
|
|
262
|
+
}, _parent));
|
|
263
|
+
_push(`</div>`);
|
|
264
|
+
};
|
|
265
|
+
}
|
|
266
|
+
});
|
|
267
|
+
const _sfc_setup$1 = _sfc_main$1.setup;
|
|
268
|
+
_sfc_main$1.setup = (props, ctx) => {
|
|
269
|
+
const ssrContext = vue.useSSRContext();
|
|
270
|
+
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/Area/Area.vue");
|
|
271
|
+
return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
|
|
272
|
+
};
|
|
273
|
+
var PaginationPosition = /* @__PURE__ */ ((PaginationPosition2) => {
|
|
274
|
+
PaginationPosition2["Top"] = "top";
|
|
275
|
+
PaginationPosition2["Bottom"] = "bottom";
|
|
276
|
+
return PaginationPosition2;
|
|
277
|
+
})(PaginationPosition || {});
|
|
278
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
279
|
+
__name: "Button",
|
|
280
|
+
__ssrInlineRender: true,
|
|
281
|
+
props: {
|
|
282
|
+
variant: {},
|
|
283
|
+
size: {}
|
|
284
|
+
},
|
|
285
|
+
setup(__props) {
|
|
286
|
+
return (_ctx, _push, _parent, _attrs) => {
|
|
287
|
+
_push(`<button${serverRenderer.ssrRenderAttrs(vue.mergeProps({
|
|
288
|
+
class: [
|
|
289
|
+
"button",
|
|
290
|
+
`button--${_ctx.variant || "primary"}`,
|
|
291
|
+
`button--${_ctx.size || "medium"}`
|
|
292
|
+
]
|
|
293
|
+
}, _attrs))} data-v-52b6ec0c>`);
|
|
294
|
+
serverRenderer.ssrRenderSlot(_ctx.$slots, "default", {}, null, _push, _parent);
|
|
295
|
+
_push(`</button>`);
|
|
296
|
+
};
|
|
297
|
+
}
|
|
298
|
+
});
|
|
299
|
+
const _export_sfc = (sfc, props) => {
|
|
300
|
+
const target = sfc.__vccOpts || sfc;
|
|
301
|
+
for (const [key, val] of props) {
|
|
302
|
+
target[key] = val;
|
|
303
|
+
}
|
|
304
|
+
return target;
|
|
305
|
+
};
|
|
306
|
+
const _sfc_setup = _sfc_main.setup;
|
|
307
|
+
_sfc_main.setup = (props, ctx) => {
|
|
308
|
+
const ssrContext = vue.useSSRContext();
|
|
309
|
+
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/Button/Button.vue");
|
|
310
|
+
return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
|
|
311
|
+
};
|
|
312
|
+
const Button = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-52b6ec0c"]]);
|
|
313
|
+
exports2.Area = _sfc_main$1;
|
|
314
|
+
exports2.Button = Button;
|
|
315
|
+
exports2.PaginationPosition = PaginationPosition;
|
|
316
|
+
Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
|
|
317
|
+
});
|