@appcorp/app-corp-vista 0.0.58 → 0.0.60

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.
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV1Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV1: FC<VistaProgressV1Props>;
@@ -0,0 +1,19 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV1 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var VistaProgressV1 = function (_a) {
9
+ var steps = _a.steps;
10
+ return (react_1.default.createElement("nav", { "aria-label": "Progress" },
11
+ react_1.default.createElement("ol", { role: "list", className: "space-y-4 md:flex md:space-y-0 md:space-x-8" }, steps.map(function (step) { return (react_1.default.createElement("li", { key: step.name, className: "md:flex-1" }, step.status === 'complete' ? (react_1.default.createElement("a", { href: step.href, className: "group flex flex-col border-l-4 border-indigo-600 py-2 pl-4 hover:border-indigo-800 md:border-t-4 md:border-l-0 md:pt-4 md:pb-0 md:pl-0" },
12
+ react_1.default.createElement("span", { className: "text-sm font-medium text-indigo-600 group-hover:text-indigo-800" }, step.id),
13
+ react_1.default.createElement("span", { className: "text-sm font-medium" }, step.name))) : step.status === 'current' ? (react_1.default.createElement("a", { href: step.href, "aria-current": "step", className: "flex flex-col border-l-4 border-indigo-600 py-2 pl-4 md:border-t-4 md:border-l-0 md:pt-4 md:pb-0 md:pl-0" },
14
+ react_1.default.createElement("span", { className: "text-sm font-medium text-indigo-600" }, step.id),
15
+ react_1.default.createElement("span", { className: "text-sm font-medium" }, step.name))) : (react_1.default.createElement("a", { href: step.href, className: "group flex flex-col border-l-4 border-gray-200 py-2 pl-4 hover:border-gray-300 md:border-t-4 md:border-l-0 md:pt-4 md:pb-0 md:pl-0" },
16
+ react_1.default.createElement("span", { className: "text-sm font-medium text-gray-500 group-hover:text-gray-700" }, step.id),
17
+ react_1.default.createElement("span", { className: "text-sm font-medium" }, step.name))))); }))));
18
+ };
19
+ exports.VistaProgressV1 = VistaProgressV1;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV2Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV2: FC<VistaProgressV2Props>;
@@ -0,0 +1,42 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV2 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var solid_1 = require("@heroicons/react/24/solid");
9
+ var vista_button_v1_1 = require("../vista-button-v1/vista-button-v1");
10
+ var vista_button_type_1 = require("../../type/vista-button-type");
11
+ var VistaProgressV2 = function (_a) {
12
+ var actions = _a.actions, children = _a.children, currentSelected = _a.currentSelected, handleOnChangeTab = _a.handleOnChangeTab, steps = _a.steps;
13
+ return (react_1.default.createElement("div", { className: 'h-[calc(100vh-74px-70px)]' },
14
+ react_1.default.createElement("nav", { "aria-label": "Progress" },
15
+ react_1.default.createElement("ol", { role: "list", className: "divide-y divide-gray-300 rounded-md border border-gray-300 md:flex md:divide-y-0" }, steps.map(function (_a, stepIdx) {
16
+ var name = _a.name, status = _a.status, id = _a.id;
17
+ var isCurrent = currentSelected === name;
18
+ return (react_1.default.createElement("li", { key: name, className: "relative md:flex md:flex-1" },
19
+ react_1.default.createElement("div", { className: "group flex w-full items-center cursor-pointer", onClick: function () { return handleOnChangeTab(name); } },
20
+ react_1.default.createElement("span", { className: "flex items-center px-6 py-4 text-sm font-medium" },
21
+ status === 'complete' ? (react_1.default.createElement("span", { className: "flex size-10 shrink-0 items-center justify-center rounded-full bg-primary group-hover:bg-primary" },
22
+ react_1.default.createElement(solid_1.CheckIcon, { "aria-hidden": "true", className: "size-6 text-white" }))) : (react_1.default.createElement("span", { className: "flex size-10 shrink-0 items-center justify-center rounded-full border-2 border-primary" },
23
+ react_1.default.createElement("span", { className: "text-primary" }, id))),
24
+ react_1.default.createElement("span", { className: "ml-4 text-sm font-medium ".concat(isCurrent ? 'text-primary' : 'text-gray-500') }, name))),
25
+ stepIdx !== steps.length - 1 && (react_1.default.createElement(react_1.default.Fragment, null,
26
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute top-0 right-0 hidden h-full w-5 md:block" },
27
+ react_1.default.createElement("svg", { fill: "none", viewBox: "0 0 22 80", preserveAspectRatio: "none", className: "size-full text-gray-300" },
28
+ react_1.default.createElement("path", { d: "M0 -2L20 40L0 82", stroke: "currentcolor", vectorEffect: "non-scaling-stroke", strokeLinejoin: "round" })))))));
29
+ }))),
30
+ react_1.default.createElement("div", { className: 'h-full p-4' }, children),
31
+ react_1.default.createElement("div", { className: 'rounded-md border border-gray-300 flex justify-between items-center px-8 py-4' }, actions
32
+ .filter(function (_a) {
33
+ var enabled = _a.enabled;
34
+ return enabled;
35
+ })
36
+ .sort(function (a, b) { return a.order - b.order; })
37
+ .map(function (_a) {
38
+ var id = _a.id, label = _a.label, handleOnClick = _a.handleOnClick, disabled = _a.disabled;
39
+ return (react_1.default.createElement(vista_button_v1_1.VistaButtonV1, { key: id, label: label, handleOnClick: handleOnClick, size: vista_button_type_1.VISTA_BUTTON_SIZE.LG, disabled: disabled }));
40
+ }))));
41
+ };
42
+ exports.VistaProgressV2 = VistaProgressV2;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV3Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV3: FC<VistaProgressV3Props>;
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV3 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var VistaProgressV3 = function (_a) {
9
+ var steps = _a.steps;
10
+ return (react_1.default.createElement("nav", { "aria-label": "Progress", className: "flex items-center justify-center" },
11
+ react_1.default.createElement("p", { className: "text-sm font-medium" },
12
+ "Step ",
13
+ steps.findIndex(function (step) { return step.status === 'current'; }) + 1,
14
+ " of ",
15
+ steps.length),
16
+ react_1.default.createElement("ol", { role: "list", className: "ml-8 flex items-center space-x-5" }, steps.map(function (step) { return (react_1.default.createElement("li", { key: step.name }, step.status === 'complete' ? (react_1.default.createElement("a", { href: step.href, className: "block size-2.5 rounded-full bg-indigo-600 hover:bg-indigo-900" },
17
+ react_1.default.createElement("span", { className: "sr-only" }, step.name))) : step.status === 'current' ? (react_1.default.createElement("a", { href: step.href, "aria-current": "step", className: "relative flex items-center justify-center" },
18
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "absolute flex size-5 p-px" },
19
+ react_1.default.createElement("span", { className: "size-full rounded-full bg-indigo-200" })),
20
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "relative block size-2.5 rounded-full bg-indigo-600" }),
21
+ react_1.default.createElement("span", { className: "sr-only" }, step.name))) : (react_1.default.createElement("a", { href: step.href, className: "block size-2.5 rounded-full bg-gray-200 hover:bg-gray-400" },
22
+ react_1.default.createElement("span", { className: "sr-only" }, step.name))))); }))));
23
+ };
24
+ exports.VistaProgressV3 = VistaProgressV3;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV4Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV4: FC<VistaProgressV4Props>;
@@ -0,0 +1,46 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV4 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var solid_1 = require("@heroicons/react/24/solid");
9
+ var class_names_1 = require("../../utils/class-names");
10
+ var VistaProgressV4 = function (_a) {
11
+ var steps = _a.steps;
12
+ return (react_1.default.createElement("div", { className: "lg:border-t lg:border-b lg:border-gray-200" },
13
+ react_1.default.createElement("nav", { "aria-label": "Progress", className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8" },
14
+ react_1.default.createElement("ol", { role: "list", className: "overflow-hidden rounded-md lg:flex lg:rounded-none lg:border-r lg:border-l lg:border-gray-200" }, steps.map(function (step, stepIdx) { return (react_1.default.createElement("li", { key: step.id, className: "relative overflow-hidden lg:flex-1" },
15
+ react_1.default.createElement("div", { className: (0, class_names_1.classNames)(stepIdx === 0 ? 'rounded-t-md border-b-0' : '', stepIdx === steps.length - 1 ? 'rounded-b-md border-t-0' : '', 'overflow-hidden border border-gray-200 lg:border-0') },
16
+ step.status === 'complete' ? (react_1.default.createElement("a", { href: step.href, className: "group" },
17
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "absolute top-0 left-0 h-full w-1 bg-transparent group-hover:bg-gray-200 lg:top-auto lg:bottom-0 lg:h-1 lg:w-full" }),
18
+ react_1.default.createElement("span", { className: (0, class_names_1.classNames)(stepIdx !== 0 ? 'lg:pl-9' : '', 'flex items-start px-6 py-5 text-sm font-medium') },
19
+ react_1.default.createElement("span", { className: "shrink-0" },
20
+ react_1.default.createElement("span", { className: "flex size-10 items-center justify-center rounded-full bg-indigo-600" },
21
+ react_1.default.createElement(solid_1.CheckIcon, { "aria-hidden": "true", className: "size-6 text-white" }))),
22
+ react_1.default.createElement("span", { className: "mt-0.5 ml-4 flex min-w-0 flex-col" },
23
+ react_1.default.createElement("span", { className: "text-sm font-medium" }, step.name),
24
+ react_1.default.createElement("span", { className: "text-sm font-medium text-gray-500" }, step.description))))) : step.status === 'current' ? (react_1.default.createElement("a", { href: step.href, "aria-current": "step" },
25
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "absolute top-0 left-0 h-full w-1 bg-indigo-600 lg:top-auto lg:bottom-0 lg:h-1 lg:w-full" }),
26
+ react_1.default.createElement("span", { className: (0, class_names_1.classNames)(stepIdx !== 0 ? 'lg:pl-9' : '', 'flex items-start px-6 py-5 text-sm font-medium') },
27
+ react_1.default.createElement("span", { className: "shrink-0" },
28
+ react_1.default.createElement("span", { className: "flex size-10 items-center justify-center rounded-full border-2 border-indigo-600" },
29
+ react_1.default.createElement("span", { className: "text-indigo-600" }, step.id))),
30
+ react_1.default.createElement("span", { className: "mt-0.5 ml-4 flex min-w-0 flex-col" },
31
+ react_1.default.createElement("span", { className: "text-sm font-medium text-indigo-600" }, step.name),
32
+ react_1.default.createElement("span", { className: "text-sm font-medium text-gray-500" }, step.description))))) : (react_1.default.createElement("a", { href: step.href, className: "group" },
33
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "absolute top-0 left-0 h-full w-1 bg-transparent group-hover:bg-gray-200 lg:top-auto lg:bottom-0 lg:h-1 lg:w-full" }),
34
+ react_1.default.createElement("span", { className: (0, class_names_1.classNames)(stepIdx !== 0 ? 'lg:pl-9' : '', 'flex items-start px-6 py-5 text-sm font-medium') },
35
+ react_1.default.createElement("span", { className: "shrink-0" },
36
+ react_1.default.createElement("span", { className: "flex size-10 items-center justify-center rounded-full border-2 border-gray-300" },
37
+ react_1.default.createElement("span", { className: "text-gray-500" }, step.id))),
38
+ react_1.default.createElement("span", { className: "mt-0.5 ml-4 flex min-w-0 flex-col" },
39
+ react_1.default.createElement("span", { className: "text-sm font-medium text-gray-500" }, step.name),
40
+ react_1.default.createElement("span", { className: "text-sm font-medium text-gray-500" }, step.description))))),
41
+ stepIdx !== 0 ? (react_1.default.createElement(react_1.default.Fragment, null,
42
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 top-0 left-0 hidden w-3 lg:block" },
43
+ react_1.default.createElement("svg", { fill: "none", viewBox: "0 0 12 82", preserveAspectRatio: "none", className: "size-full text-gray-300" },
44
+ react_1.default.createElement("path", { d: "M0.5 0V31L10.5 41L0.5 51V82", stroke: "currentcolor", vectorEffect: "non-scaling-stroke" }))))) : null))); })))));
45
+ };
46
+ exports.VistaProgressV4 = VistaProgressV4;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV5Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV5: FC<VistaProgressV5Props>;
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV5 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var solid_1 = require("@heroicons/react/24/solid");
9
+ var class_names_1 = require("../../utils/class-names");
10
+ var VistaProgressV5 = function (_a) {
11
+ var steps = _a.steps;
12
+ return (react_1.default.createElement("nav", { "aria-label": "Progress" },
13
+ react_1.default.createElement("ol", { role: "list", className: "flex items-center" }, steps.map(function (step, stepIdx) { return (react_1.default.createElement("li", { key: step.name, className: (0, class_names_1.classNames)(stepIdx !== steps.length - 1 ? 'pr-8 sm:pr-20' : '', 'relative') }, step.status === 'complete' ? (react_1.default.createElement(react_1.default.Fragment, null,
14
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 flex items-center" },
15
+ react_1.default.createElement("div", { className: "h-0.5 w-full bg-indigo-600" })),
16
+ react_1.default.createElement("a", { href: "#", className: "relative flex size-8 items-center justify-center rounded-full bg-indigo-600 hover:bg-indigo-900" },
17
+ react_1.default.createElement(solid_1.CheckIcon, { "aria-hidden": "true", className: "size-5 text-white" }),
18
+ react_1.default.createElement("span", { className: "sr-only" }, step.name)))) : step.status === 'current' ? (react_1.default.createElement(react_1.default.Fragment, null,
19
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 flex items-center" },
20
+ react_1.default.createElement("div", { className: "h-0.5 w-full bg-gray-200" })),
21
+ react_1.default.createElement("a", { href: "#", "aria-current": "step", className: "relative flex size-8 items-center justify-center rounded-full border-2 border-indigo-600 bg-white" },
22
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "size-2.5 rounded-full bg-indigo-600" }),
23
+ react_1.default.createElement("span", { className: "sr-only" }, step.name)))) : (react_1.default.createElement(react_1.default.Fragment, null,
24
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 flex items-center" },
25
+ react_1.default.createElement("div", { className: "h-0.5 w-full bg-gray-200" })),
26
+ react_1.default.createElement("a", { href: "#", className: "group relative flex size-8 items-center justify-center rounded-full border-2 border-gray-300 bg-white hover:border-gray-400" },
27
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "size-2.5 rounded-full bg-transparent group-hover:bg-gray-300" }),
28
+ react_1.default.createElement("span", { className: "sr-only" }, step.name)))))); }))));
29
+ };
30
+ exports.VistaProgressV5 = VistaProgressV5;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV6Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV6: FC<VistaProgressV6Props>;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV6 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var solid_1 = require("@heroicons/react/20/solid");
9
+ var VistaProgressV6 = function (_a) {
10
+ var steps = _a.steps;
11
+ return (react_1.default.createElement("div", { className: "px-4 py-12 sm:px-6 lg:px-8" },
12
+ react_1.default.createElement("nav", { "aria-label": "Progress", className: "flex justify-center" },
13
+ react_1.default.createElement("ol", { role: "list", className: "space-y-6" }, steps.map(function (step) { return (react_1.default.createElement("li", { key: step.name }, step.status === 'complete' ? (react_1.default.createElement("a", { href: step.href, className: "group" },
14
+ react_1.default.createElement("span", { className: "flex items-start" },
15
+ react_1.default.createElement("span", { className: "relative flex size-5 shrink-0 items-center justify-center" },
16
+ react_1.default.createElement(solid_1.CheckCircleIcon, { "aria-hidden": "true", className: "size-full text-indigo-600 group-hover:text-indigo-800" })),
17
+ react_1.default.createElement("span", { className: "ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900" }, step.name)))) : step.status === 'current' ? (react_1.default.createElement("a", { href: step.href, "aria-current": "step", className: "flex items-start" },
18
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "relative flex size-5 shrink-0 items-center justify-center" },
19
+ react_1.default.createElement("span", { className: "absolute size-4 rounded-full bg-indigo-200" }),
20
+ react_1.default.createElement("span", { className: "relative block size-2 rounded-full bg-indigo-600" })),
21
+ react_1.default.createElement("span", { className: "ml-3 text-sm font-medium text-indigo-600" }, step.name))) : (react_1.default.createElement("a", { href: step.href, className: "group" },
22
+ react_1.default.createElement("div", { className: "flex items-start" },
23
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "relative flex size-5 shrink-0 items-center justify-center" },
24
+ react_1.default.createElement("div", { className: "size-2 rounded-full bg-gray-300 group-hover:bg-gray-400" })),
25
+ react_1.default.createElement("p", { className: "ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900" }, step.name)))))); })))));
26
+ };
27
+ exports.VistaProgressV6 = VistaProgressV6;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV7Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV7: FC<VistaProgressV7Props>;
@@ -0,0 +1,39 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV7 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var solid_1 = require("@heroicons/react/20/solid");
9
+ var class_names_1 = require("../../utils/class-names");
10
+ var VistaProgressV7 = function (_a) {
11
+ var steps = _a.steps;
12
+ return (react_1.default.createElement("nav", { "aria-label": "Progress" },
13
+ react_1.default.createElement("ol", { role: "list", className: "overflow-hidden" }, steps.map(function (step, stepIdx) { return (react_1.default.createElement("li", { key: step.name, className: (0, class_names_1.classNames)(stepIdx !== steps.length - 1 ? 'pb-10' : '', 'relative') }, step.status === 'complete' ? (react_1.default.createElement(react_1.default.Fragment, null,
14
+ stepIdx !== steps.length - 1 ? (react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute top-4 left-4 mt-0.5 -ml-px h-full w-0.5 bg-indigo-600" })) : null,
15
+ react_1.default.createElement("a", { href: step.href, className: "group relative flex items-start" },
16
+ react_1.default.createElement("span", { className: "flex h-9 items-center" },
17
+ react_1.default.createElement("span", { className: "relative z-10 flex size-8 items-center justify-center rounded-full bg-indigo-600 group-hover:bg-indigo-800" },
18
+ react_1.default.createElement(solid_1.CheckIcon, { "aria-hidden": "true", className: "size-5 text-white" }))),
19
+ react_1.default.createElement("span", { className: "ml-4 flex min-w-0 flex-col" },
20
+ react_1.default.createElement("span", { className: "text-sm font-medium" }, step.name),
21
+ react_1.default.createElement("span", { className: "text-sm text-gray-500" }, step.description))))) : step.status === 'current' ? (react_1.default.createElement(react_1.default.Fragment, null,
22
+ stepIdx !== steps.length - 1 ? (react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute top-4 left-4 mt-0.5 -ml-px h-full w-0.5 bg-gray-300" })) : null,
23
+ react_1.default.createElement("a", { href: step.href, "aria-current": "step", className: "group relative flex items-start" },
24
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "flex h-9 items-center" },
25
+ react_1.default.createElement("span", { className: "relative z-10 flex size-8 items-center justify-center rounded-full border-2 border-indigo-600 bg-white" },
26
+ react_1.default.createElement("span", { className: "size-2.5 rounded-full bg-indigo-600" }))),
27
+ react_1.default.createElement("span", { className: "ml-4 flex min-w-0 flex-col" },
28
+ react_1.default.createElement("span", { className: "text-sm font-medium text-indigo-600" }, step.name),
29
+ react_1.default.createElement("span", { className: "text-sm text-gray-500" }, step.description))))) : (react_1.default.createElement(react_1.default.Fragment, null,
30
+ stepIdx !== steps.length - 1 ? (react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute top-4 left-4 mt-0.5 -ml-px h-full w-0.5 bg-gray-300" })) : null,
31
+ react_1.default.createElement("a", { href: step.href, className: "group relative flex items-start" },
32
+ react_1.default.createElement("span", { "aria-hidden": "true", className: "flex h-9 items-center" },
33
+ react_1.default.createElement("span", { className: "relative z-10 flex size-8 items-center justify-center rounded-full border-2 border-gray-300 bg-white group-hover:border-gray-400" },
34
+ react_1.default.createElement("span", { className: "size-2.5 rounded-full bg-transparent group-hover:bg-gray-300" }))),
35
+ react_1.default.createElement("span", { className: "ml-4 flex min-w-0 flex-col" },
36
+ react_1.default.createElement("span", { className: "text-sm font-medium text-gray-500" }, step.name),
37
+ react_1.default.createElement("span", { className: "text-sm text-gray-500" }, step.description))))))); }))));
38
+ };
39
+ exports.VistaProgressV7 = VistaProgressV7;
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import { VistaProgressV8Props } from '../../type/vista-progress-type';
3
+ export declare const VistaProgressV8: FC<VistaProgressV8Props>;
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VistaProgressV8 = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var VistaProgressV8 = function (_a) {
9
+ var steps = _a.steps;
10
+ return (react_1.default.createElement("div", null,
11
+ react_1.default.createElement("h4", { className: "sr-only" }, "Status"),
12
+ react_1.default.createElement("p", { className: "text-sm font-medium text-gray-900" }, "Migrating MySQL database..."),
13
+ react_1.default.createElement("div", { "aria-hidden": "true", className: "mt-6" },
14
+ react_1.default.createElement("div", { className: "overflow-hidden rounded-full bg-gray-200" },
15
+ react_1.default.createElement("div", { style: { width: '37.5%' }, className: "h-2 rounded-full bg-indigo-600" })),
16
+ react_1.default.createElement("div", { className: "mt-6 hidden grid-cols-4 text-sm font-medium text-gray-600 sm:grid" },
17
+ react_1.default.createElement("div", { className: "text-indigo-600" }, "Copying files"),
18
+ react_1.default.createElement("div", { className: "text-center text-indigo-600" }, "Migrating database"),
19
+ react_1.default.createElement("div", { className: "text-center" }, "Compiling assets"),
20
+ react_1.default.createElement("div", { className: "text-right" }, "Deployed")))));
21
+ };
22
+ exports.VistaProgressV8 = VistaProgressV8;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@appcorp/app-corp-vista",
3
- "version": "0.0.58",
3
+ "version": "0.0.60",
4
4
  "scripts": {
5
5
  "build": "yarn clean && yarn build:ts && cp package.json lib && cp README.md lib",
6
6
  "build:next": "next build",
@@ -24,7 +24,7 @@
24
24
  "storybook": "concurrently 'yarn:watch:*'",
25
25
  "upgrade": "ncu -u",
26
26
  "watch:storybook": "storybook dev -p 9001",
27
- "watch:tailwind": "npx tailwindcss -i src/styles/globals.css -o src/styles/tailwind-output.css --watch"
27
+ "watch:tailwind": "npx @tailwindcss/cli -i src/styles/globals.css -o src/styles/tailwind-output.css --watch"
28
28
  },
29
29
  "dependencies": {},
30
30
  "devDependencies": {
@@ -53,8 +53,9 @@
53
53
  "@storybook/react": "8.5.1",
54
54
  "@storybook/test": "8.5.1",
55
55
  "@storybook/types": "8.5.1",
56
+ "@tailwindcss/cli": "^4.0.3",
56
57
  "@tailwindcss/forms": "^0.5.10",
57
- "@tailwindcss/postcss": "^4.0.0",
58
+ "@tailwindcss/postcss": "^4.0.3",
58
59
  "@types/node": "^22",
59
60
  "@types/react": "^19",
60
61
  "@types/react-dom": "^19",
@@ -76,7 +77,7 @@
76
77
  "react-dom": "^19",
77
78
  "storybook": "8.5.1",
78
79
  "swr": "^2.3.0",
79
- "tailwindcss": "^4.0.0",
80
+ "tailwindcss": "^4.0.3",
80
81
  "tailwindcss-animate": "^1.0.7",
81
82
  "typescript": "^5"
82
83
  },
@@ -0,0 +1,79 @@
1
+ import { ReactNode } from "react";
2
+ export interface VistaProgressV1StepProps {
3
+ id: string;
4
+ name: string;
5
+ href: string;
6
+ status: string;
7
+ }
8
+ export interface VistaProgressV2StepProps {
9
+ id: string;
10
+ name: string;
11
+ status: string;
12
+ }
13
+ export interface VistaProgressV2ActionProps {
14
+ disabled: boolean;
15
+ enabled: boolean;
16
+ handleOnClick: () => void;
17
+ id: string;
18
+ label: string;
19
+ order: number;
20
+ }
21
+ export interface VistaProgressV3StepProps {
22
+ name: string;
23
+ href: string;
24
+ status: string;
25
+ }
26
+ export interface VistaProgressV4StepProps {
27
+ id: string;
28
+ name: string;
29
+ description: string;
30
+ href: string;
31
+ status: string;
32
+ }
33
+ export interface VistaProgressV5StepProps {
34
+ name: string;
35
+ href: string;
36
+ status: string;
37
+ }
38
+ export interface VistaProgressV6StepProps {
39
+ name: string;
40
+ href: string;
41
+ status: string;
42
+ }
43
+ export interface VistaProgressV7StepProps {
44
+ name: string;
45
+ description: string;
46
+ href: string;
47
+ status: string;
48
+ }
49
+ export interface VistaProgressV8StepProps {
50
+ name: string;
51
+ }
52
+ export interface VistaProgressV1Props {
53
+ steps: VistaProgressV1StepProps[];
54
+ }
55
+ export interface VistaProgressV2Props {
56
+ children: ReactNode;
57
+ currentSelected: string;
58
+ handleOnChangeTab: (n: string) => void;
59
+ steps: VistaProgressV2StepProps[];
60
+ actions: VistaProgressV2ActionProps[];
61
+ }
62
+ export interface VistaProgressV3Props {
63
+ steps: VistaProgressV3StepProps[];
64
+ }
65
+ export interface VistaProgressV4Props {
66
+ steps: VistaProgressV4StepProps[];
67
+ }
68
+ export interface VistaProgressV5Props {
69
+ steps: VistaProgressV5StepProps[];
70
+ }
71
+ export interface VistaProgressV6Props {
72
+ steps: VistaProgressV6StepProps[];
73
+ }
74
+ export interface VistaProgressV7Props {
75
+ steps: VistaProgressV7StepProps[];
76
+ }
77
+ export interface VistaProgressV8Props {
78
+ steps: VistaProgressV8StepProps[];
79
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });