@appcorp/app-corp-vista 0.2.25 → 0.2.27
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/organisms/vista-feature-v2/vista-feature-v2.d.ts +3 -2
- package/organisms/vista-feature-v2/vista-feature-v2.js +17 -31
- package/organisms/vista-product-list-v5/vista-product-list-v5.js +3 -3
- package/organisms/vista-product-overview-v3/vista-product-overview-v3.js +2 -2
- package/package.json +2 -2
- package/type/vista-feature-type.d.ts +13 -1
- package/type/vista-product-list-type.d.ts +2 -1
- package/type/vista-product-overview-type.d.ts +2 -0
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { VistaFeatureV2Props } from '../../type/vista-feature-type';
|
|
3
|
+
export declare const VistaFeatureV2: FC<VistaFeatureV2Props>;
|
|
@@ -5,39 +5,25 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.VistaFeatureV2 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
|
-
var
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
description: 'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Maiores impedit perferendis suscipit eaque, iste dolor cupiditate blanditiis ratione.',
|
|
13
|
-
icon: solid_1.CloudArrowUpIcon,
|
|
14
|
-
},
|
|
15
|
-
{
|
|
16
|
-
name: 'SSL certificates.',
|
|
17
|
-
description: 'Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo.',
|
|
18
|
-
icon: solid_1.LockClosedIcon,
|
|
19
|
-
},
|
|
20
|
-
{
|
|
21
|
-
name: 'Database backups.',
|
|
22
|
-
description: 'Ac tincidunt sapien vehicula erat auctor pellentesque rhoncus. Et magna sit morbi lobortis.',
|
|
23
|
-
icon: solid_1.ServerIcon,
|
|
24
|
-
},
|
|
25
|
-
];
|
|
26
|
-
var VistaFeatureV2 = function () {
|
|
27
|
-
return (react_1.default.createElement("div", { className: "overflow-hidden bg-white py-24 sm:py-32" },
|
|
8
|
+
var image_1 = __importDefault(require("next/image"));
|
|
9
|
+
var VistaFeatureV2 = function (_a) {
|
|
10
|
+
var description = _a.description, imageAlt = _a.imageAlt, imageSrc = _a.imageSrc, items = _a.items, _b = _a.revert, revert = _b === void 0 ? false : _b, subTitle = _a.subTitle, title = _a.title;
|
|
11
|
+
return (react_1.default.createElement("div", { className: "overflow-hidden bg-white py-20 sm:py-32" },
|
|
28
12
|
react_1.default.createElement("div", { className: "mx-auto max-w-7xl px-6 lg:px-8" },
|
|
29
13
|
react_1.default.createElement("div", { className: "mx-auto grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 sm:gap-y-20 lg:mx-0 lg:max-w-none lg:grid-cols-2" },
|
|
30
|
-
react_1.default.createElement("div", { className: "lg:pt-4 lg:pr-8" },
|
|
14
|
+
react_1.default.createElement("div", { className: "lg:pt-4 lg:pr-8 w-full ".concat(revert ? 'order-2' : 'order-1') },
|
|
31
15
|
react_1.default.createElement("div", { className: "lg:max-w-lg" },
|
|
32
|
-
react_1.default.createElement("h2", { className: "text-base/7 font-semibold text-
|
|
33
|
-
react_1.default.createElement("p", { className: "mt-2 text-4xl font-semibold tracking-tight text-pretty text-gray-900 sm:text-5xl" },
|
|
34
|
-
react_1.default.createElement("p", { className: "mt-6 text-lg/8 text-gray-700" },
|
|
35
|
-
react_1.default.createElement("dl", { className: "mt-10 max-w-xl space-y-8 text-base/7 text-gray-600 lg:max-w-none" },
|
|
36
|
-
react_1.default.createElement("
|
|
37
|
-
react_1.default.createElement(feature.icon, { "aria-hidden": "true", className: "
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
16
|
+
react_1.default.createElement("h2", { className: "text-base/7 font-semibold text-primary" }, subTitle),
|
|
17
|
+
react_1.default.createElement("p", { className: "mt-2 text-4xl font-semibold tracking-tight text-pretty text-gray-900 sm:text-5xl" }, title),
|
|
18
|
+
react_1.default.createElement("p", { className: "mt-6 text-lg/8 text-gray-700" }, description),
|
|
19
|
+
react_1.default.createElement("dl", { className: "mt-10 max-w-xl space-y-8 text-base/7 text-gray-600 lg:max-w-none" }, items.map(function (feature) { return (react_1.default.createElement("div", { key: feature.name, className: "flex flex-row gap-2" },
|
|
20
|
+
react_1.default.createElement("div", { className: "size-5 ".concat(revert ? 'order-1' : 'order-2') },
|
|
21
|
+
react_1.default.createElement(feature.icon, { "aria-hidden": "true", className: "size-5 text-primary mt-1" })),
|
|
22
|
+
react_1.default.createElement("p", { className: "".concat(revert ? 'order-1' : 'order-2') },
|
|
23
|
+
react_1.default.createElement("span", { className: 'font-semibold text-gray-900' },
|
|
24
|
+
feature.name,
|
|
25
|
+
' '),
|
|
26
|
+
react_1.default.createElement("span", { className: "inline" }, feature.description)))); })))),
|
|
27
|
+
react_1.default.createElement(image_1.default, { alt: imageAlt, className: "w-3xl max-w-none rounded-xl shadow-xl ring-1 ring-gray-400/10 sm:w-228 md:-ml-4 lg:-ml-0 ".concat(revert ? 'order-1 lg:-ml-80' : 'order-2'), height: 1442, src: imageSrc, width: 232 })))));
|
|
42
28
|
};
|
|
43
29
|
exports.VistaFeatureV2 = VistaFeatureV2;
|
|
@@ -17,7 +17,7 @@ var VistaProductListV5 = function (_a) {
|
|
|
17
17
|
})
|
|
18
18
|
.sort(function (a, b) { return a.order - b.order; })
|
|
19
19
|
.map(function (_a) {
|
|
20
|
-
var
|
|
20
|
+
var color = _a.color, ctaLabel = _a.ctaLabel, handleOnClick = _a.handleOnClick, id = _a.id, imageAlt = _a.imageAlt, imageSrc = _a.imageSrc, name = _a.name, price = _a.price;
|
|
21
21
|
return (react_1.default.createElement("div", { key: id },
|
|
22
22
|
react_1.default.createElement("div", { className: "relative" },
|
|
23
23
|
react_1.default.createElement("div", { className: "relative h-72 w-full overflow-hidden rounded-lg" },
|
|
@@ -29,8 +29,8 @@ var VistaProductListV5 = function (_a) {
|
|
|
29
29
|
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-x-0 bottom-0 h-48 bg-linear-to-t from-primary opacity-50" }),
|
|
30
30
|
price && (react_1.default.createElement("p", { className: "relative text-lg font-semibold text-white" }, price)))),
|
|
31
31
|
react_1.default.createElement("div", { className: "mt-6" },
|
|
32
|
-
react_1.default.createElement("
|
|
33
|
-
|
|
32
|
+
react_1.default.createElement("button", { onClick: handleOnClick, className: "relative flex w-full items-center justify-center rounded-md border border-transparent bg-primary/30 px-8 py-2 text-sm font-medium text-gray-900 hover:bg-primary/40" },
|
|
33
|
+
ctaLabel,
|
|
34
34
|
react_1.default.createElement("span", { className: "sr-only" },
|
|
35
35
|
", ",
|
|
36
36
|
name)))));
|
|
@@ -63,7 +63,7 @@ var DynamicReactSlick = (0, dynamic_1.default)(function () { return Promise.reso
|
|
|
63
63
|
ssr: false,
|
|
64
64
|
});
|
|
65
65
|
var VistaProductOverviewV3 = function (_a) {
|
|
66
|
-
var averageReview = _a.averageReview, breadcrumbs = _a.breadcrumbs, description = _a.description, _b = _a.guaranteeInfo, guaranteeInfo = _b === void 0 ? false : _b, _c = _a.helpInfo, helpInfo = _c === void 0 ? false : _c, _d = _a.highlights, highlights = _d === void 0 ? [] : _d, images = _a.images, name = _a.name, price = _a.price, totalCountReview = _a.totalCountReview, _e = _a.variants, variants = _e === void 0 ? [] : _e;
|
|
66
|
+
var averageReview = _a.averageReview, breadcrumbs = _a.breadcrumbs, ctaLabel = _a.ctaLabel, description = _a.description, _b = _a.guaranteeInfo, guaranteeInfo = _b === void 0 ? false : _b, handleCtaOnClick = _a.handleCtaOnClick, _c = _a.helpInfo, helpInfo = _c === void 0 ? false : _c, _d = _a.highlights, highlights = _d === void 0 ? [] : _d, images = _a.images, name = _a.name, price = _a.price, totalCountReview = _a.totalCountReview, _e = _a.variants, variants = _e === void 0 ? [] : _e;
|
|
67
67
|
var slickConfig = {
|
|
68
68
|
dots: true,
|
|
69
69
|
infinite: (images === null || images === void 0 ? void 0 : images.length) === 1 ? false : true,
|
|
@@ -136,7 +136,7 @@ var VistaProductOverviewV3 = function (_a) {
|
|
|
136
136
|
react_1.default.createElement("span", null, "What size should I buy?"),
|
|
137
137
|
react_1.default.createElement(solid_1.QuestionMarkCircleIcon, { "aria-hidden": "true", className: "ml-2 size-5 shrink-0 text-gray-400 group-hover:text-gray-500" })))),
|
|
138
138
|
react_1.default.createElement("div", { className: "mt-10" },
|
|
139
|
-
react_1.default.createElement("button", { type: "submit", className: "flex w-full items-center justify-center rounded-md border border-transparent bg-primary px-8 py-3 text-base font-medium text-white hover:bg-primary/80 focus:ring-2 focus:ring-primary focus:ring-offset-2 focus:ring-offset-gray-50 focus:outline-hidden" },
|
|
139
|
+
react_1.default.createElement("button", { type: "submit", className: "flex w-full items-center justify-center rounded-md border border-transparent bg-primary px-8 py-3 text-base font-medium text-white hover:bg-primary/80 focus:ring-2 focus:ring-primary focus:ring-offset-2 focus:ring-offset-gray-50 focus:outline-hidden", onClick: handleCtaOnClick }, ctaLabel)),
|
|
140
140
|
guaranteeInfo && (react_1.default.createElement("div", { className: "mt-6 text-center" },
|
|
141
141
|
react_1.default.createElement("a", { href: "#", className: "group inline-flex text-base font-medium" },
|
|
142
142
|
react_1.default.createElement(outline_1.ShieldCheckIcon, { "aria-hidden": "true", className: "mr-2 size-6 shrink-0 text-gray-400 group-hover:text-gray-500" }),
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@appcorp/app-corp-vista",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.27",
|
|
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",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"@react-jvectormap/core": "^1.0.4",
|
|
44
44
|
"@react-jvectormap/world": "^1.1.2",
|
|
45
45
|
"@react-pakistan/react-icon-collection": "^3.5.0",
|
|
46
|
-
"@react-pakistan/util-functions": "^1.24.
|
|
46
|
+
"@react-pakistan/util-functions": "^1.24.22",
|
|
47
47
|
"@remixicon/react": "^4.6.0",
|
|
48
48
|
"@storybook/addon-essentials": "^8",
|
|
49
49
|
"@storybook/addon-interactions": "^8",
|
|
@@ -1,8 +1,20 @@
|
|
|
1
|
+
import { ForwardRefExoticComponent, SVGProps } from "react";
|
|
1
2
|
export interface VistaFeatureV1Props {
|
|
2
3
|
id: string;
|
|
3
4
|
}
|
|
5
|
+
export interface VistaFeatureV2Item {
|
|
6
|
+
name: string;
|
|
7
|
+
description: string;
|
|
8
|
+
icon: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref">>;
|
|
9
|
+
}
|
|
4
10
|
export interface VistaFeatureV2Props {
|
|
5
|
-
|
|
11
|
+
description: string;
|
|
12
|
+
imageAlt: string;
|
|
13
|
+
imageSrc: string;
|
|
14
|
+
items: VistaFeatureV2Item[];
|
|
15
|
+
revert?: boolean;
|
|
16
|
+
subTitle: string;
|
|
17
|
+
title: string;
|
|
6
18
|
}
|
|
7
19
|
export interface VistaFeatureV3Props {
|
|
8
20
|
id: string;
|
|
@@ -21,8 +21,9 @@ export interface VistaProductListV4Props {
|
|
|
21
21
|
}
|
|
22
22
|
export interface VistaProductListV5Item {
|
|
23
23
|
color?: string;
|
|
24
|
+
ctaLabel?: string;
|
|
24
25
|
enabled: boolean;
|
|
25
|
-
|
|
26
|
+
handleOnClick: () => void;
|
|
26
27
|
id: string;
|
|
27
28
|
imageAlt: string;
|
|
28
29
|
imageSrc: string;
|
|
@@ -38,6 +38,8 @@ export interface VistaProductOverviewV3Image {
|
|
|
38
38
|
export interface VistaProductOverviewV3Props {
|
|
39
39
|
averageReview?: number;
|
|
40
40
|
breadcrumbs: VistaProductOverviewV3BreadcrumbItem[];
|
|
41
|
+
ctaLabel: string;
|
|
42
|
+
handleCtaOnClick: () => void;
|
|
41
43
|
description: string;
|
|
42
44
|
guaranteeInfo?: boolean;
|
|
43
45
|
helpInfo?: boolean;
|