sccoreui 2.2.7 → 2.2.9
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/App.js +2 -3
- package/dist/assets/sccoreui.css +9 -12
- package/dist/components/sliders/sliders.js +4 -0
- package/dist/index.js +2 -2
- package/dist/pages/avatar/avatar.js +13 -115
- package/dist/pages/home.js +2 -1
- package/dist/pages/sliders/slider.js +39 -0
- package/dist/pages/toggle/toggle.js +1 -1
- package/dist/types/components/sliders/sliders.d.ts +2 -0
- package/dist/types/index.d.ts +1 -1
- package/dist/types/pages/sliders/slider.d.ts +1 -0
- package/package.json +1 -1
package/dist/App.js
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const tslib_1 = require("tslib");
|
|
4
3
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
|
|
4
|
+
// import Home from './pages/home';
|
|
6
5
|
require("./App.scss");
|
|
7
6
|
const App = () => {
|
|
8
|
-
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("div", {
|
|
7
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("div", {}) }));
|
|
9
8
|
};
|
|
10
9
|
exports.default = App;
|
package/dist/assets/sccoreui.css
CHANGED
|
@@ -1356,16 +1356,13 @@ a {
|
|
|
1356
1356
|
}
|
|
1357
1357
|
/* #################################################### Toggle Switch CSS changes START ################################################# */
|
|
1358
1358
|
.p-inputswitch {
|
|
1359
|
-
width: 2.25rem;
|
|
1360
|
-
height: 1.25rem;
|
|
1361
|
-
}
|
|
1362
|
-
|
|
1363
|
-
.p-inputswitch-dark {
|
|
1364
1359
|
--default-unchecked-bg: var(--gray-100);
|
|
1365
1360
|
--default-checked-bg: var(--primary-600);
|
|
1366
1361
|
--hover-unchecked-bg: var(--gray-200);
|
|
1367
1362
|
--hover-checked-bg: var(--primary-700);
|
|
1368
1363
|
--focus-unchecked-bg: var(--gray-50);
|
|
1364
|
+
width: 2.25rem;
|
|
1365
|
+
height: 1.25rem;
|
|
1369
1366
|
}
|
|
1370
1367
|
|
|
1371
1368
|
.p-inputswitch-light {
|
|
@@ -2080,7 +2077,7 @@ a {
|
|
|
2080
2077
|
height: 0.286rem;
|
|
2081
2078
|
}
|
|
2082
2079
|
.p-slider.p-slider-horizontal .p-slider-handle {
|
|
2083
|
-
margin-top: -0.
|
|
2080
|
+
margin-top: -0.75rem;
|
|
2084
2081
|
margin-left: -0.5715rem;
|
|
2085
2082
|
}
|
|
2086
2083
|
.p-slider.p-slider-vertical {
|
|
@@ -2091,10 +2088,10 @@ a {
|
|
|
2091
2088
|
margin-bottom: -0.5715rem;
|
|
2092
2089
|
}
|
|
2093
2090
|
.p-slider .p-slider-handle {
|
|
2094
|
-
height: 1.
|
|
2095
|
-
width: 1.
|
|
2091
|
+
height: 1.5rem;
|
|
2092
|
+
width: 1.5rem;
|
|
2096
2093
|
background: #ffffff;
|
|
2097
|
-
border:
|
|
2094
|
+
border: 1.5px solid var(--primary-500);
|
|
2098
2095
|
border-radius: 50%;
|
|
2099
2096
|
transition: background-color 0.2s, color 0.2s, border-color 0.2s,
|
|
2100
2097
|
box-shadow 0.2s;
|
|
@@ -2105,11 +2102,11 @@ a {
|
|
|
2105
2102
|
box-shadow: 0 0 0 0.2rem #c7d2fe;
|
|
2106
2103
|
}
|
|
2107
2104
|
.p-slider .p-slider-range {
|
|
2108
|
-
background:
|
|
2105
|
+
background: var(--primary-500);
|
|
2109
2106
|
}
|
|
2110
2107
|
.p-slider:not(.p-disabled) .p-slider-handle:hover {
|
|
2111
|
-
background:
|
|
2112
|
-
border-color:
|
|
2108
|
+
background: var(--primary-500);
|
|
2109
|
+
border-color: var(--primary-500);
|
|
2113
2110
|
}
|
|
2114
2111
|
|
|
2115
2112
|
.p-treeselect {
|
package/dist/index.js
CHANGED
|
@@ -83,8 +83,8 @@ Object.defineProperty(exports, "DataView", { enumerable: true, get: function ()
|
|
|
83
83
|
Object.defineProperty(exports, "DataViewLayoutOptions", { enumerable: true, get: function () { return data_view_1.DataViewLayoutOptions; } });
|
|
84
84
|
var split_button_1 = require("./components/button/split-button");
|
|
85
85
|
Object.defineProperty(exports, "SplitButton", { enumerable: true, get: function () { return tslib_1.__importDefault(split_button_1).default; } });
|
|
86
|
-
var
|
|
87
|
-
Object.defineProperty(exports, "SpeedDial", { enumerable: true, get: function () { return tslib_1.__importDefault(
|
|
86
|
+
var speed_dial_1 = require("./components/button/speed-dial");
|
|
87
|
+
Object.defineProperty(exports, "SpeedDial", { enumerable: true, get: function () { return tslib_1.__importDefault(speed_dial_1).default; } });
|
|
88
88
|
var input_mask_1 = require("./components/input/input-mask");
|
|
89
89
|
Object.defineProperty(exports, "InputMask", { enumerable: true, get: function () { return tslib_1.__importDefault(input_mask_1).default; } });
|
|
90
90
|
var input_switch_1 = require("./components/input/input-switch");
|
|
@@ -10,143 +10,41 @@ const avatar_1 = require("primereact/avatar");
|
|
|
10
10
|
const avatargroup_1 = require("primereact/avatargroup");
|
|
11
11
|
const profile_square_image_png_1 = tslib_1.__importDefault(require("../../assets/images/profile-square-image.png"));
|
|
12
12
|
const AvatarComponent = () => {
|
|
13
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mb-4" }, { children: "Tags" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle
|
|
13
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mb-4" }, { children: "Tags" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-4rem h-4rem p-avatar-focus" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-4rem h-4rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-4rem h-4rem p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 w-1rem h-1rem border-circle absolute border-1 border-white", style: {
|
|
14
14
|
position: "absolute",
|
|
15
15
|
right: "0",
|
|
16
16
|
bottom: "0",
|
|
17
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "
|
|
18
|
-
position: "absolute",
|
|
19
|
-
right: "0",
|
|
20
|
-
bottom: "0",
|
|
21
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-md border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-md p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-md border-circle absolute border-1 border-white", style: {
|
|
22
|
-
position: "absolute",
|
|
23
|
-
right: "0",
|
|
24
|
-
bottom: "0",
|
|
25
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-lg border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-lg p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-lg border-circle absolute border-1 border-white", style: {
|
|
26
|
-
position: "absolute",
|
|
27
|
-
right: "0",
|
|
28
|
-
bottom: "0",
|
|
29
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-xl border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-xl p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-xl border-circle absolute border-1 border-white", style: {
|
|
30
|
-
position: "absolute",
|
|
31
|
-
right: "0",
|
|
32
|
-
bottom: "0",
|
|
33
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-2xl border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-2xl p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-2xl border-circle absolute border-1 border-white", style: {
|
|
34
|
-
position: "absolute",
|
|
35
|
-
right: "0",
|
|
36
|
-
bottom: "0",
|
|
37
|
-
} })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 justify-content-between gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-xs border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-xs p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
38
|
-
right: "-2px",
|
|
39
|
-
bottom: "-2px",
|
|
40
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-xs" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-sm border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-sm p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
41
|
-
right: "-2px",
|
|
42
|
-
bottom: "-2px",
|
|
43
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-sm" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-md border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-md p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
44
|
-
right: "-2px",
|
|
45
|
-
bottom: "-2px",
|
|
46
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-md" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-lg border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-lg p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
47
|
-
right: "-2px",
|
|
48
|
-
bottom: "-2px",
|
|
49
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-lg" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-xl border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-xl p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
50
|
-
right: "-2px",
|
|
51
|
-
bottom: "-2px",
|
|
52
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-2xl border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-2xl p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
53
|
-
right: "-2px",
|
|
54
|
-
bottom: "-2px",
|
|
55
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-2xl" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 justify-content-between gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-xs border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-xs p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
17
|
+
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-4rem h-4rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-4rem h-4rem p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
56
18
|
right: "-2px",
|
|
57
19
|
bottom: "-2px",
|
|
58
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "
|
|
20
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-2xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-4rem h-4rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-4rem h-4rem p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
59
21
|
right: "-2px",
|
|
60
22
|
bottom: "-2px",
|
|
61
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-
|
|
62
|
-
right: "-2px",
|
|
63
|
-
bottom: "-2px",
|
|
64
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-md" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-lg border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-lg p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
65
|
-
right: "-2px",
|
|
66
|
-
bottom: "-2px",
|
|
67
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-lg" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-xl border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-xl p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
68
|
-
right: "-2px",
|
|
69
|
-
bottom: "-2px",
|
|
70
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-2xl border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-2xl p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
71
|
-
right: "-2px",
|
|
72
|
-
bottom: "-2px",
|
|
73
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-2xl" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-xs border-circle relative bg-gray-100 flex align-items-center justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-xs" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-xs border-circle border-1 border-white", style: {
|
|
23
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-2xl" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "w-4rem h-4rem border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-2xl" }) })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "w-4rem h-4rem border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-2xl" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 w-1rem h-1rem border-circle border-1 border-white", style: {
|
|
74
24
|
position: "absolute",
|
|
75
25
|
right: "0px",
|
|
76
26
|
bottom: "0px",
|
|
77
|
-
} })] })), (0, jsx_runtime_1.
|
|
27
|
+
} })] })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "w-4rem h-4rem border-circle bg-gray-100 text-2xl flex align-items-center text-gray-600 font-medium justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: "OR" })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "w-4rem h-4rem border-circle relative bg-gray-100 text-2xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200", style: { fontSize: "18px" } }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 w-1rem h-1rem border-circle absolute border-1 border-white", style: {
|
|
78
28
|
position: "absolute",
|
|
79
29
|
right: "0px",
|
|
80
30
|
bottom: "0px",
|
|
81
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "
|
|
82
|
-
position: "absolute",
|
|
83
|
-
right: "0px",
|
|
84
|
-
bottom: "0px",
|
|
85
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-lg border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-lg" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-lg border-circle border-1 border-white", style: {
|
|
86
|
-
position: "absolute",
|
|
87
|
-
right: "0px",
|
|
88
|
-
bottom: "0px",
|
|
89
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-xl border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-xl" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-xl border-circle border-1 border-white", style: {
|
|
90
|
-
position: "absolute",
|
|
91
|
-
right: "0px",
|
|
92
|
-
bottom: "0px",
|
|
93
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-2xl border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-2xl" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-2xl border-circle border-1 border-white", style: {
|
|
94
|
-
position: "absolute",
|
|
95
|
-
right: "0px",
|
|
96
|
-
bottom: "0px",
|
|
97
|
-
} })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-xs border-circle bg-gray-100 flex align-items-center justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-xs" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-sm border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-sm" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-md border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-md" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-lg border-circle bg-gray-100 flex align-items-center justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-lg" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-xl border-circle bg-gray-100 flex align-items-center justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-xl" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-2xl border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-user-2xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-sm border-circle relative bg-gray-100 flex align-items-center text-sm text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-sm border-circle absolute border-1 border-white", style: {
|
|
98
|
-
right: "0px",
|
|
99
|
-
bottom: "0px",
|
|
100
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-md border-circle relative bg-gray-100 flex align-items-center text-lg text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-md border-circle absolute border-1 border-white", style: {
|
|
101
|
-
right: "0px",
|
|
102
|
-
bottom: "0px",
|
|
103
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-lg border-circle relative bg-gray-100 text-18 flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200", style: { fontSize: "18px" } }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-lg border-circle absolute border-1 border-white", style: {
|
|
104
|
-
position: "absolute",
|
|
105
|
-
right: "0px",
|
|
106
|
-
bottom: "0px",
|
|
107
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-xl border-circle relative bg-gray-100 text-xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200", style: { fontSize: "18px" } }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-xl border-circle absolute border-1 border-white", style: {
|
|
108
|
-
position: "absolute",
|
|
109
|
-
right: "0px",
|
|
110
|
-
bottom: "0px",
|
|
111
|
-
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-2xl border-circle relative bg-gray-100 text-2xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200", style: { fontSize: "18px" } }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-2xl border-circle absolute border-1 border-white", style: {
|
|
112
|
-
position: "absolute",
|
|
113
|
-
right: "0px",
|
|
114
|
-
bottom: "0px",
|
|
115
|
-
} })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-sm border-circle bg-gray-100 flex align-items-center text-sm text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: "OR" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-md border-circle bg-gray-100 flex align-items-center text-lg text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: "OR" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-lg border-circle bg-gray-100 text-18 flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: "OR" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-xl border-circle bg-gray-100 text-xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: "OR" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-avatar-2xl border-circle bg-gray-100 text-2xl flex align-items-center text-gray-600 font-medium justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: "OR" }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-md border-circle relative bg-gray-100 text-lg flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "absolute ", style: {
|
|
116
|
-
position: "absolute",
|
|
117
|
-
right: "-2px",
|
|
118
|
-
bottom: "-2px",
|
|
119
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-md" }) }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "p-avatar-lg border-circle relative bg-gray-100 text-18 flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "absolute ", style: {
|
|
31
|
+
} })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "w-4rem h-4rem border-circle relative bg-gray-100 text-xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200" }, { children: ["OR", (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "absolute ", style: {
|
|
120
32
|
position: "absolute",
|
|
121
33
|
right: "-2px",
|
|
122
34
|
bottom: "-2px",
|
|
123
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-
|
|
124
|
-
position: "absolute",
|
|
125
|
-
right: "-2px",
|
|
126
|
-
bottom: "-2px",
|
|
127
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-xl" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "p-avatar-xs border-gray-300 border-1 bg-white avatar-button p-dark-tooltip border-dashed p-0 flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 border-1 avatar-button bg-white p-dark-tooltip border-dashed w-2rem h-2rem p-0 flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 border-1 avatar-button bg-white p-dark-tooltip border-dashed p-avatar-md flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ disabled: true, rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 border-1 avatar-button bg-white p-dark-tooltip border-dashed p-avatar-md flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3 my-8" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [(0, jsx_runtime_1.jsxs)(avatargroup_1.AvatarGroup, { children: [(0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { label: "+2", shape: "circle", size: "large", className: "bg-gray-100 text-gray-600 text-base font-medium" })] }), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 p-0 border-1 ml-1 bg-white avatar-button p-dark-tooltip border-dashed h-2rem w-2rem flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [(0, jsx_runtime_1.jsxs)(avatargroup_1.AvatarGroup, { children: [(0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "xlarge" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "xlarge" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "xlarge" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "xlarge" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "xlarge" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { label: "+2", shape: "circle", size: "xlarge", className: "bg-gray-100 text-gray-600 text-base line-height-3 font-medium" })] }), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 p-0 border-1 ml-1 bg-white avatar-button p-dark-tooltip border-dashed p-avatar-md flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-sm p-avatar-focus" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-semibold line-height-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-sm font-normal line-height-2" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-md p-avatar-focus" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-semibold line-height-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-normal line-height-2" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-lg p-avatar-focus" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-semibold line-height-3" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-normal line-height-3" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-lg p-avatar-focus" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-semibold line-height-3" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-normal line-height-3" }, { children: "olivia@untitledui.com" }))] }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-sm border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-sm p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-sm border-circle absolute border-1 border-white", style: {
|
|
128
|
-
position: "absolute",
|
|
129
|
-
right: "0",
|
|
130
|
-
bottom: "0",
|
|
131
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-semibold line-height-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-sm font-normal line-height-2" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-avatar-md border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle p-avatar-md p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-md border-circle absolute border-1 border-white", style: {
|
|
35
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-xl" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "w-3rem h-3rem border-gray-300 border-1 bg-white avatar-button p-dark-tooltip border-dashed p-0 flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ disabled: true, rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 border-1 avatar-button bg-white p-dark-tooltip border-dashed w-3rem h-3rem flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3 my-8" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [(0, jsx_runtime_1.jsxs)(avatargroup_1.AvatarGroup, { children: [(0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { image: avatar_for_av_component_png_1.default, shape: "circle", size: "large" }), (0, jsx_runtime_1.jsx)(avatar_1.Avatar, { label: "+2", shape: "circle", size: "large", className: "bg-gray-100 text-gray-600 text-base font-medium" })] }), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ rounded: true, tooltipOptions: { position: "top" }, tooltip: "Add user", className: "border-gray-300 p-0 border-1 ml-1 bg-white avatar-button p-dark-tooltip border-dashed h-2rem w-2rem flex align-items-center justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-button-plus" }) }))] })) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-2rem h-2rem p-avatar-focus" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-semibold line-height-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-sm font-normal line-height-2" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-2rem h-2rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-2rem h-2rem p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", { className: "bg-green-500 green-online-indicator-sm border-circle absolute border-1 border-white", style: {
|
|
132
36
|
position: "absolute",
|
|
133
37
|
right: "0",
|
|
134
38
|
bottom: "0",
|
|
135
|
-
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-semibold line-height-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-
|
|
39
|
+
} })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-semibold line-height-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-sm font-normal line-height-2" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-3rem h-3rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-3rem h-3rem p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
136
40
|
right: "-2px",
|
|
137
41
|
bottom: "-2px",
|
|
138
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-lg" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-semibold line-height-3" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-normal line-height-3" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "
|
|
42
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "avatar-company-logo-lg" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-semibold line-height-3" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-normal line-height-3" }, { children: "olivia@untitledui.com" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-4rem h-4rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle w-4rem h-4rem p-avatar-focus" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
139
43
|
right: "-2px",
|
|
140
44
|
bottom: "-2px",
|
|
141
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
right: "2px",
|
|
146
|
-
bottom: "2px",
|
|
147
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-3xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-11rem h-11rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle border-3 border-white w-11rem h-11rem sc-profile" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
148
|
-
right: "4px",
|
|
149
|
-
bottom: "4px",
|
|
150
|
-
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-4xl" }) }))] }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-10rem flex flex-column align-items-start" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: profile_square_image_png_1.default, alt: "profile", className: "h-10rem " }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg text-gray-900 line-height-3 pt-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "flex align-items-center gap-2 line-height-3 " }, { children: [(0, jsx_runtime_1.jsx)("a", Object.assign({ href: "www.google.com" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "link-01" }) })), (0, jsx_runtime_1.jsx)("a", Object.assign({ href: "www.google.com", className: "text-gray-500 font-normal" }, { children: "Source" }))] }))] })) }))] }))] }));
|
|
45
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-xl" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-semibold line-height-3" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-normal line-height-3" }, { children: "olivia@untitledui.com" }))] }))] }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-6rem h-6rem border-circle flex align-items-center justify-content-center relative " }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_for_av_component_png_1.default, className: " border-circle border-3 border-white w-6rem h-6rem sc-profile" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: " absolute ", style: {
|
|
46
|
+
right: "2px",
|
|
47
|
+
bottom: "2px",
|
|
48
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "verified-tick-3xl" }) }))] })) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-10rem flex flex-column align-items-start" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: profile_square_image_png_1.default, alt: "profile", className: "h-10rem " }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg text-gray-900 line-height-3 pt-2" }, { children: "Olivia Rhye" })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "flex align-items-center gap-2 line-height-3 " }, { children: [(0, jsx_runtime_1.jsx)("a", Object.assign({ href: "www.google.com" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { iconName: "link-01" }) })), (0, jsx_runtime_1.jsx)("a", Object.assign({ href: "www.google.com", className: "text-gray-500 font-normal" }, { children: "Source" }))] }))] })) }))] }))] }));
|
|
151
49
|
};
|
|
152
50
|
exports.default = AvatarComponent;
|
package/dist/pages/home.js
CHANGED
|
@@ -13,11 +13,12 @@ const radio_button_component_1 = tslib_1.__importDefault(require("./radio-button
|
|
|
13
13
|
const tags_1 = tslib_1.__importDefault(require("./tags/tags"));
|
|
14
14
|
const progress_bar_1 = tslib_1.__importDefault(require("./progress-bar/progress-bar"));
|
|
15
15
|
const avatar_1 = tslib_1.__importDefault(require("./avatar/avatar"));
|
|
16
|
+
const slider_1 = tslib_1.__importDefault(require("./sliders/slider"));
|
|
16
17
|
const flex_1 = tslib_1.__importDefault(require("./flex"));
|
|
17
18
|
const checkbox_group_component_1 = tslib_1.__importDefault(require("./checkbox-group/checkbox-group-component"));
|
|
18
19
|
const toggle_1 = tslib_1.__importDefault(require("./toggle/toggle"));
|
|
19
20
|
const tooltip_1 = tslib_1.__importDefault(require("./tooltip/tooltip"));
|
|
20
21
|
const Home = () => {
|
|
21
|
-
return ((0, jsx_runtime_1.jsx)(react_router_dom_1.BrowserRouter, { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.Routes, { children: [(0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/dropdown", element: (0, jsx_runtime_1.jsx)(dropdown_component_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/input", element: (0, jsx_runtime_1.jsx)(input_text_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/color-picker", element: (0, jsx_runtime_1.jsx)(color_picker_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/toast", element: (0, jsx_runtime_1.jsx)(toast_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/tooltip", element: (0, jsx_runtime_1.jsx)(tooltip_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/badges", element: (0, jsx_runtime_1.jsx)(badge_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/checkbox", element: (0, jsx_runtime_1.jsx)(checkbox_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/checkbox-group", element: (0, jsx_runtime_1.jsx)(checkbox_group_component_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/radio-button", element: (0, jsx_runtime_1.jsx)(radio_button_component_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/tags", element: (0, jsx_runtime_1.jsx)(tags_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/toggle-switch", element: (0, jsx_runtime_1.jsx)(toggle_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/progress-bar", element: (0, jsx_runtime_1.jsx)(progress_bar_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/avatar", element: (0, jsx_runtime_1.jsx)(avatar_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/flex", element: (0, jsx_runtime_1.jsx)(flex_1.default, {}) })] }) }));
|
|
22
|
+
return ((0, jsx_runtime_1.jsx)(react_router_dom_1.BrowserRouter, { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.Routes, { children: [(0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/dropdown", element: (0, jsx_runtime_1.jsx)(dropdown_component_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/input", element: (0, jsx_runtime_1.jsx)(input_text_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/color-picker", element: (0, jsx_runtime_1.jsx)(color_picker_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/toast", element: (0, jsx_runtime_1.jsx)(toast_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/tooltip", element: (0, jsx_runtime_1.jsx)(tooltip_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/badges", element: (0, jsx_runtime_1.jsx)(badge_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/checkbox", element: (0, jsx_runtime_1.jsx)(checkbox_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/checkbox-group", element: (0, jsx_runtime_1.jsx)(checkbox_group_component_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/radio-button", element: (0, jsx_runtime_1.jsx)(radio_button_component_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/tags", element: (0, jsx_runtime_1.jsx)(tags_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/toggle-switch", element: (0, jsx_runtime_1.jsx)(toggle_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/progress-bar", element: (0, jsx_runtime_1.jsx)(progress_bar_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/avatar", element: (0, jsx_runtime_1.jsx)(avatar_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/flex", element: (0, jsx_runtime_1.jsx)(flex_1.default, {}) }), (0, jsx_runtime_1.jsx)(react_router_dom_1.Route, { path: "/slider", element: (0, jsx_runtime_1.jsx)(slider_1.default, {}) })] }) }));
|
|
22
23
|
};
|
|
23
24
|
exports.default = Home;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const slider_1 = require("primereact/slider");
|
|
6
|
+
function SliderComponent() {
|
|
7
|
+
const [value, setValue] = (0, react_1.useState)([10, 10]);
|
|
8
|
+
console.log(value);
|
|
9
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mb-4" }, { children: "Input" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid my-8" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-6 md:col-4 lg:col-3 px-7 flex mt-8 flex-column justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(slider_1.Slider, { value: value, onChange: (e) => setValue(e.value), className: "w-full", range: true }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-6 md:col-4 lg:col-3 px-7 mt-8 flex flex-column justify-content-center" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "relative w-full " }, { children: [(0, jsx_runtime_1.jsx)(slider_1.Slider, { value: value, onChange: (e) => setValue(e.value), className: "w-full", range: true }), (0, jsx_runtime_1.jsxs)("span", Object.assign({ style: {
|
|
10
|
+
position: "absolute",
|
|
11
|
+
height: "34px",
|
|
12
|
+
top: -35,
|
|
13
|
+
alignSelf: "stretch",
|
|
14
|
+
left: `${value[0]}%`,
|
|
15
|
+
transform: "translate(-50%, -50%)",
|
|
16
|
+
}, className: "px-3 bg-white border-1 border-gray-200 py-2 flex align-items-center border-round-lg text-center text-lg" }, { children: [value[0], "%"] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ style: {
|
|
17
|
+
position: "absolute",
|
|
18
|
+
height: "34px",
|
|
19
|
+
top: -35,
|
|
20
|
+
alignSelf: "stretch",
|
|
21
|
+
left: `${value[1]}%`,
|
|
22
|
+
transform: "translate(-50%, -50%)",
|
|
23
|
+
}, className: "px-3 bg-white border-1 border-gray-200 py-2 flex align-items-center border-round-lg text-center text-lg" }, { children: [value[1], "%"] }))] })) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-6 md:col-4 lg:col-3 px-7 mt-8 flex flex-column justify-content-center" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "relative w-full" }, { children: [(0, jsx_runtime_1.jsx)(slider_1.Slider, { value: value, onChange: (e) => setValue(e.value), className: "w-full", range: true }), (0, jsx_runtime_1.jsxs)("span", Object.assign({ style: {
|
|
24
|
+
position: "absolute",
|
|
25
|
+
height: "34px",
|
|
26
|
+
top: -35,
|
|
27
|
+
alignSelf: "stretch",
|
|
28
|
+
left: `${value[0]}%`,
|
|
29
|
+
transform: "translate(-50%, -50%)",
|
|
30
|
+
}, className: "px-3 bg-white border-gray-200 py-2 flex align-items-center text-center text-lg" }, { children: [value[0], "%"] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ style: {
|
|
31
|
+
position: "absolute",
|
|
32
|
+
height: "34px",
|
|
33
|
+
top: -35,
|
|
34
|
+
alignSelf: "stretch",
|
|
35
|
+
left: `${value[1]}%`,
|
|
36
|
+
transform: "translate(-50%, -50%)",
|
|
37
|
+
}, className: "px-3 bg-white border-gray-200 py-2 flex align-items-center text-center text-lg" }, { children: [value[1], "%"] }))] })) }))] }))] }));
|
|
38
|
+
}
|
|
39
|
+
exports.default = SliderComponent;
|
|
@@ -5,6 +5,6 @@ const inputswitch_1 = require("primereact/inputswitch");
|
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const ToggleSwitch = () => {
|
|
7
7
|
const [isChecked, setIsChecked] = (0, react_1.useState)(false);
|
|
8
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mt-0 mb-4" }, { children: "Toggle Switch" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-center gap-5 mb-5 p-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column gap-3 mb-5" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: isChecked, onChange: () => setIsChecked(!isChecked)
|
|
8
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mt-0 mb-4" }, { children: "Toggle Switch" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-center gap-5 mb-5 p-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column gap-3 mb-5" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: isChecked, onChange: () => setIsChecked(!isChecked) }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: true }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, disabled: true }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, className: "p-invalid" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column gap-3 mb-5" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: isChecked, onChange: () => setIsChecked(!isChecked), className: "p-inputswitch-light" }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: true, className: "p-inputswitch-light" }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, disabled: true, className: "p-inputswitch-light" }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, className: "p-invalid p-inputswitch-light" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-center align-items-center gap-5" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: isChecked, onChange: () => setIsChecked(!isChecked), className: "mt-1" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: true, className: "mt-1" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, disabled: true, className: "mt-1" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, className: "mt-1 p-invalid" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: isChecked, onChange: () => setIsChecked(!isChecked), className: "mt-1 p-inputswitch-light" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: true, className: "mt-1 p-inputswitch-light" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, disabled: true, className: "mt-1 p-inputswitch-light" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-start gap-3" }, { children: [(0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: false, className: "mt-1 p-invalid p-inputswitch-light" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-700 font-medium text-base" }, { children: "Remember me" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-600 font-normal text-base" }, { children: "Save my login details for next time." }))] }))] }))] }))] }))] }));
|
|
9
9
|
};
|
|
10
10
|
exports.default = ToggleSwitch;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -40,7 +40,7 @@ export { default as InputNumber } from './components/input/input-number';
|
|
|
40
40
|
export { default as Toast } from './components/toast/toast';
|
|
41
41
|
export { DataView, DataViewLayoutOptions } from './components/data-view/data-view';
|
|
42
42
|
export { default as SplitButton } from './components/button/split-button';
|
|
43
|
-
export { default as SpeedDial } from './components/button/
|
|
43
|
+
export { default as SpeedDial } from './components/button/speed-dial';
|
|
44
44
|
export { default as InputMask } from './components/input/input-mask';
|
|
45
45
|
export { default as InputSwitch } from './components/input/input-switch';
|
|
46
46
|
export { default as InputTextarea } from './components/input/input-textarea';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function SliderComponent(): import("react/jsx-runtime").JSX.Element;
|