@enki-tek/fms-web-components 0.1.10 → 0.1.11
Sign up to get free protection for your applications and to get access to all the features.
- package/components/Charts/LineChart.svelte +1 -1
- package/components/StatusCard/StatusCard.scss +4 -0
- package/components/StatusCard/StatusCard.svelte +13 -7
- package/components/StatusCard/StatusCard.svelte.d.ts +2 -0
- package/components/StatusCard/StatusCardBody.svelte +4 -0
- package/components/StatusCard/StatusCardSubtitle.svelte +7 -0
- package/components/StatusCard/StatusCardSubtitle.svelte.d.ts +23 -0
- package/components/StatusCard/StatusCardTitle.svelte +4 -0
- package/components/WidgetCard/WidgetCard.svelte +7 -3
- package/index.d.ts +2 -1
- package/index.js +2 -1
- package/package.json +2 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<script>
|
|
3
3
|
import { Chart, registerables } from 'chart.js';
|
|
4
4
|
import { onDestroy, onMount } from 'svelte';
|
|
5
|
-
import { chartOptions } from './chartOptions';
|
|
5
|
+
import { chartOptions, getChartData } from './chartOptions';
|
|
6
6
|
|
|
7
7
|
export let data = {};
|
|
8
8
|
export let label = '';
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
<script>
|
|
2
|
-
export let className =
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
export let className = '';
|
|
3
|
+
export let small = false;
|
|
4
|
+
</script>
|
|
5
|
+
|
|
6
|
+
<div class="col-12 col-md-6 col-sm-6 col-lg-6 col-xl-3">
|
|
7
|
+
<div class="m-2 card {className} {small? 'card-mini':''}">
|
|
6
8
|
<slot />
|
|
7
9
|
</div>
|
|
8
|
-
|
|
9
|
-
|
|
10
|
+
</div>
|
|
11
|
+
|
|
12
|
+
<style>@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
|
|
10
13
|
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
|
|
11
14
|
@import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap");
|
|
12
15
|
.card {
|
|
@@ -17,6 +20,10 @@
|
|
|
17
20
|
font-family: Roboto;
|
|
18
21
|
min-height: 14rem;
|
|
19
22
|
}
|
|
23
|
+
.card-mini {
|
|
24
|
+
height: 6rem !important;
|
|
25
|
+
min-height: 6rem !important;
|
|
26
|
+
}
|
|
20
27
|
.title {
|
|
21
28
|
font-size: 24px;
|
|
22
29
|
font-weight: 400;
|
|
@@ -40,4 +47,3 @@
|
|
|
40
47
|
width: fit-content;
|
|
41
48
|
border-radius: 0.3333333333rem;
|
|
42
49
|
}</style>
|
|
43
|
-
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
/** @typedef {typeof __propDef.slots} StatusCardSlots */
|
|
4
4
|
export default class StatusCard extends SvelteComponentTyped<{
|
|
5
5
|
className?: string | undefined;
|
|
6
|
+
small?: boolean | undefined;
|
|
6
7
|
}, {
|
|
7
8
|
[evt: string]: CustomEvent<any>;
|
|
8
9
|
}, {
|
|
@@ -16,6 +17,7 @@ import { SvelteComponentTyped } from "svelte";
|
|
|
16
17
|
declare const __propDef: {
|
|
17
18
|
props: {
|
|
18
19
|
className?: string | undefined;
|
|
20
|
+
small?: boolean | undefined;
|
|
19
21
|
};
|
|
20
22
|
events: {
|
|
21
23
|
[evt: string]: CustomEvent<any>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/** @typedef {typeof __propDef.props} StatusCardSubtitleProps */
|
|
2
|
+
/** @typedef {typeof __propDef.events} StatusCardSubtitleEvents */
|
|
3
|
+
/** @typedef {typeof __propDef.slots} StatusCardSubtitleSlots */
|
|
4
|
+
export default class StatusCardSubtitle extends SvelteComponentTyped<{
|
|
5
|
+
value?: string | undefined;
|
|
6
|
+
}, {
|
|
7
|
+
[evt: string]: CustomEvent<any>;
|
|
8
|
+
}, {}> {
|
|
9
|
+
}
|
|
10
|
+
export type StatusCardSubtitleProps = typeof __propDef.props;
|
|
11
|
+
export type StatusCardSubtitleEvents = typeof __propDef.events;
|
|
12
|
+
export type StatusCardSubtitleSlots = typeof __propDef.slots;
|
|
13
|
+
import { SvelteComponentTyped } from "svelte";
|
|
14
|
+
declare const __propDef: {
|
|
15
|
+
props: {
|
|
16
|
+
value?: string | undefined;
|
|
17
|
+
};
|
|
18
|
+
events: {
|
|
19
|
+
[evt: string]: CustomEvent<any>;
|
|
20
|
+
};
|
|
21
|
+
slots: {};
|
|
22
|
+
};
|
|
23
|
+
export {};
|
|
@@ -20,15 +20,19 @@
|
|
|
20
20
|
</script>
|
|
21
21
|
|
|
22
22
|
{#key cardLength}
|
|
23
|
-
<div
|
|
23
|
+
<div
|
|
24
|
+
class="col-12 col-md-{cardLength * 2} col-sm-{cardLength * 2} col-lg-{cardLength < 6
|
|
25
|
+
? cardLength * 2
|
|
26
|
+
: cardLength} col-xl-{cardLength}"
|
|
27
|
+
>
|
|
24
28
|
<div bind:this={element}>
|
|
25
29
|
<div class="m-2 card">
|
|
26
30
|
<Row>
|
|
27
|
-
<Col md=10>
|
|
31
|
+
<Col md="10">
|
|
28
32
|
<div class="title fw-normal">{title}</div>
|
|
29
33
|
</Col>
|
|
30
34
|
{#if resizable}
|
|
31
|
-
<Col md=2>
|
|
35
|
+
<Col md="2">
|
|
32
36
|
<div class="float-end">
|
|
33
37
|
<i on:click={toggleMaximize} class="material-icons"
|
|
34
38
|
>{!maximized ? 'zoom_out_map' : 'zoom_in_map'}</i
|
package/index.d.ts
CHANGED
|
@@ -74,5 +74,6 @@ import DoughnutChart from './components/Charts/DoughnutChart.svelte';
|
|
|
74
74
|
import PieChart from './components/Charts/PieChart.svelte';
|
|
75
75
|
import BarChart from './components/Charts/Barchart.svelte';
|
|
76
76
|
import LineChart from './components/Charts/LineChart.svelte';
|
|
77
|
-
|
|
77
|
+
import StatusCardSubtitle from './components/StatusCard/StatusCardSubtitle.svelte';
|
|
78
|
+
export { Accordion, AccordionItem, ActionIcon, ActionIconGroup, Alert, Badge, Brand, Breadcrumb, Button, Card, CardBody, CardFooter, CardIcon, CardiconBody, CardiconSubtitle, CardiconTitle, CardLink, CardSubtitle, CardText, CardTitle, Checkbox, derivedStore, Dropdown, DropdownItem, EnkiCard, EnkiSidebar, EnkiTable, Footer, Header, HeaderItem, Icon, Layout, MainMenuHead, menuTypeStore, Modal, ModalBody, ModalFooter, ModalHeader, NavIcon, NavItem, NavLink, NotFound, Page, Pagination, RadioButton, smallMenuwidth, Switch, Tab, TableBody, TableCell, TableHead, TableHeadCell, TableRow, TextField, Toast, Tooltip, UserAvatar, HeaderDropDownLink, HeaderDropDownLinkItem, HeaderLink, HeaderLinks, Content, MenuGroup, MenuItem, SortableGrid, SideBarMenu, StatusCard, StatusCardBody, StatusCardTitle, StatusCardSubtitle, StateCard, WidgetCard, WidgetCardBody, DoughnutChart, PieChart, BarChart, LineChart, };
|
|
78
79
|
export default i18nInit;
|
package/index.js
CHANGED
|
@@ -75,5 +75,6 @@ import DoughnutChart from './components/Charts/DoughnutChart.svelte';
|
|
|
75
75
|
import PieChart from './components/Charts/PieChart.svelte';
|
|
76
76
|
import BarChart from './components/Charts/Barchart.svelte';
|
|
77
77
|
import LineChart from './components/Charts/LineChart.svelte';
|
|
78
|
-
|
|
78
|
+
import StatusCardSubtitle from './components/StatusCard/StatusCardSubtitle.svelte';
|
|
79
|
+
export { Accordion, AccordionItem, ActionIcon, ActionIconGroup, Alert, Badge, Brand, Breadcrumb, Button, Card, CardBody, CardFooter, CardIcon, CardiconBody, CardiconSubtitle, CardiconTitle, CardLink, CardSubtitle, CardText, CardTitle, Checkbox, derivedStore, Dropdown, DropdownItem, EnkiCard, EnkiSidebar, EnkiTable, Footer, Header, HeaderItem, Icon, Layout, MainMenuHead, menuTypeStore, Modal, ModalBody, ModalFooter, ModalHeader, NavIcon, NavItem, NavLink, NotFound, Page, Pagination, RadioButton, smallMenuwidth, Switch, Tab, TableBody, TableCell, TableHead, TableHeadCell, TableRow, TextField, Toast, Tooltip, UserAvatar, HeaderDropDownLink, HeaderDropDownLinkItem, HeaderLink, HeaderLinks, Content, MenuGroup, MenuItem, SortableGrid, SideBarMenu, StatusCard, StatusCardBody, StatusCardTitle, StatusCardSubtitle, StateCard, WidgetCard, WidgetCardBody, DoughnutChart, PieChart, BarChart, LineChart, };
|
|
79
80
|
export default i18nInit;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@enki-tek/fms-web-components",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.11",
|
|
4
4
|
"devDependencies": {
|
|
5
5
|
"@storybook/addon-essentials": "^7.6.14",
|
|
6
6
|
"@storybook/addon-interactions": "^7.6.14",
|
|
@@ -158,6 +158,7 @@
|
|
|
158
158
|
"./components/StatusCard/StatusCard.scss": "./components/StatusCard/StatusCard.scss",
|
|
159
159
|
"./components/StatusCard/StatusCard.svelte": "./components/StatusCard/StatusCard.svelte",
|
|
160
160
|
"./components/StatusCard/StatusCardBody.svelte": "./components/StatusCard/StatusCardBody.svelte",
|
|
161
|
+
"./components/StatusCard/StatusCardSubtitle.svelte": "./components/StatusCard/StatusCardSubtitle.svelte",
|
|
161
162
|
"./components/StatusCard/StatusCardTitle.svelte": "./components/StatusCard/StatusCardTitle.svelte",
|
|
162
163
|
"./components/Switches/Switch.scss": "./components/Switches/Switch.scss",
|
|
163
164
|
"./components/Switches/Switch.stories": "./components/Switches/Switch.stories.js",
|