zmp-ui
Version:
Zalo Mini App framework
58 lines • 2.65 kB
JavaScript
import React from "react";
import { Text, Cluster, Icon, Route, useNavigate } from "../..";
import AnimationRoutes from "./AnimationRoutes";
import ZMPRouter from "./ZMPRouter";
import Page from "../page";
import Button from "../button";
var meta = {
title: "Layout/AnimationRoutes",
component: AnimationRoutes,
tags: ["autodocs"]
};
export default meta;
var decorators = function decorators(Story) {
return /*#__PURE__*/React.createElement(ZMPRouter, {
memoryRouter: true
}, /*#__PURE__*/React.createElement(Story, null));
};
function Page1() {
var navigate = useNavigate();
return /*#__PURE__*/React.createElement(Page, null, /*#__PURE__*/React.createElement(Cluster, {
space: "16px"
}, /*#__PURE__*/React.createElement(Text.Title, null, "Ch\xE0o m\u1EEBng b\u1EA1n \u0111\u1EBFn v\u1EDBi Zalo Mini App"), /*#__PURE__*/React.createElement(Text, null, "Zalo Mini App l\xE0 nh\u1EEFng \u201C\u1EE9ng d\u1EE5ng nh\u1ECF\u201D ch\u1EA1y tr\u1EF1c ti\u1EBFp tr\xEAn n\u1EC1n t\u1EA3ng Zalo, t\u1EADn d\u1EE5ng ngu\u1ED3n t\xE0i nguy\xEAn c\xF3 s\u1EB5n v\u1EDBi ti\u1EC1m n\u0103ng kh\xF4ng gi\u1EDBi h\u1EA1n t\u1EEB Zalo."), /*#__PURE__*/React.createElement(Button, {
suffixIcon: /*#__PURE__*/React.createElement(Icon, {
icon: "zi-arrow-right"
}),
onClick: function onClick() {
return navigate("/page2");
}
}, "Ti\u1EBFp t\u1EE5c")));
}
Page1.displayName = "Page1";
function Page2() {
var navigate = useNavigate();
return /*#__PURE__*/React.createElement(Page, null, /*#__PURE__*/React.createElement(Cluster, {
space: "16px"
}, /*#__PURE__*/React.createElement(Text.Title, null, "Ch\xE0o m\u1EEBng b\u1EA1n \u0111\u1EBFn v\u1EDBi Zalo Mini App"), /*#__PURE__*/React.createElement(Text, null, "Zalo Mini App l\xE0 nh\u1EEFng \u201C\u1EE9ng d\u1EE5ng nh\u1ECF\u201D ch\u1EA1y tr\u1EF1c ti\u1EBFp tr\xEAn n\u1EC1n t\u1EA3ng Zalo, t\u1EADn d\u1EE5ng ngu\u1ED3n t\xE0i nguy\xEAn c\xF3 s\u1EB5n v\u1EDBi ti\u1EC1m n\u0103ng kh\xF4ng gi\u1EDBi h\u1EA1n t\u1EEB Zalo."), /*#__PURE__*/React.createElement(Button, {
prefixIcon: /*#__PURE__*/React.createElement(Icon, {
icon: "zi-arrow-left"
}),
onClick: function onClick() {
return navigate(-1);
}
}, "Tr\u1EDD l\u1EA1i")));
}
Page2.displayName = "Page2";
export var Default = {
name: "Mặc định",
decorators: decorators,
args: {
children: [/*#__PURE__*/React.createElement(Route, {
path: "/",
element: /*#__PURE__*/React.createElement(Page1, null)
}), /*#__PURE__*/React.createElement(Route, {
path: "/page2",
element: /*#__PURE__*/React.createElement(Page2, null)
})]
}
};