listpage-next 0.0.193 → 0.0.195

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.
@@ -1,3 +1,4 @@
1
1
  import { ClientOptions } from './types';
2
- export declare function setupBaseUrl(HttpClient: typeof import('./index').HttpClient): void;
2
+ import { type HttpClient as BaseHttpClient } from './index';
3
+ export declare function setupBaseUrl(HttpClient: typeof BaseHttpClient): void;
3
4
  export declare function mergeServerConfig(server: ClientOptions['server']): ClientOptions['server'];
@@ -1 +1,2 @@
1
- export declare function setupClient(HttpClient: typeof import('./index').HttpClient): void;
1
+ import { type HttpClient as BaseHttpClient } from './index';
2
+ export declare function setupClient(HttpClient: typeof BaseHttpClient): void;
@@ -14,9 +14,11 @@ function setupClient(HttpClient) {
14
14
  };
15
15
  HttpClient.prototype.setup = function() {
16
16
  const successCodes = this.options.successCodes || [
17
- 10000,
18
17
  200
19
18
  ];
19
+ const unauthorizedCodes = this.options.unauthorizedCodes || [
20
+ 401
21
+ ];
20
22
  const apiClient = this.createAxiosInstance();
21
23
  apiClient.interceptors.request.use((config)=>{
22
24
  config.headers.Authorization = `Bearer ${this.getToken()}`;
@@ -44,6 +46,10 @@ function setupClient(HttpClient) {
44
46
  });
45
47
  return Promise.reject(error);
46
48
  }
49
+ if (this.options.loginPath && unauthorizedCodes?.includes(response.data.code)) {
50
+ this.setToken('');
51
+ window.location.href = this.options.loginPath;
52
+ }
47
53
  return response;
48
54
  }, (error)=>{
49
55
  console.error('Response Error:', error);
@@ -1 +1,2 @@
1
- export declare function setupHeaders(HttpClient: typeof import('./index').HttpClient): void;
1
+ import { type HttpClient as BaseHttpClient } from './index';
2
+ export declare function setupHeaders(HttpClient: typeof BaseHttpClient): void;
@@ -1 +1,2 @@
1
- export declare function setupToken(HttpClient: typeof import('./index').HttpClient): void;
1
+ import { type HttpClient as BaseHttpClient } from './index';
2
+ export declare function setupToken(HttpClient: typeof BaseHttpClient): void;
@@ -4,6 +4,8 @@ export interface ClientOptions {
4
4
  token?: string;
5
5
  tokenKey?: string;
6
6
  successCodes?: number[];
7
+ unauthorizedCodes?: number[];
8
+ loginPath?: string;
7
9
  server?: {
8
10
  protocol?: string;
9
11
  host?: string;
@@ -1,10 +1,10 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import { useMemo } from "react";
2
+ import { useMemo, useState } from "react";
3
3
  import { Menu } from "antd";
4
- import { useActiveMenuKey } from "./hooks/useMenuNavigation.js";
4
+ import { styled } from "styled-components";
5
5
  const Menu_Menu = (props)=>{
6
6
  const { menus, theme, style, baseUrl } = props;
7
- const [activeKey, setActiveKey] = useActiveMenuKey(menus, baseUrl);
7
+ const [activeKey, setActiveKey] = useState(null);
8
8
  const menuItems = useMemo(()=>menus.map((item)=>({
9
9
  key: item.key,
10
10
  label: item.label,
@@ -17,7 +17,7 @@ const Menu_Menu = (props)=>{
17
17
  })), [
18
18
  menus
19
19
  ]);
20
- return /*#__PURE__*/ jsx(Menu, {
20
+ return /*#__PURE__*/ jsx(MenuStyled, {
21
21
  mode: "inline",
22
22
  theme: theme,
23
23
  style: style,
@@ -30,4 +30,9 @@ const Menu_Menu = (props)=>{
30
30
  }
31
31
  });
32
32
  };
33
+ const MenuStyled = styled(Menu)`
34
+ .ant-menu {
35
+ border-inline-end: none !important;
36
+ }
37
+ `;
33
38
  export { Menu_Menu as Menu };
@@ -1,3 +1,4 @@
1
+ import { CSSProperties } from 'react';
1
2
  import { SiderProps } from 'antd';
2
3
  import { usePageContext } from '../PageProvider';
3
4
  import { PageLogoProps } from '../PageLogo';
@@ -11,5 +12,8 @@ export interface PageLayoutProps {
11
12
  floats?: PageFloatProps[];
12
13
  defaultCollapsed?: boolean;
13
14
  siderProps?: Omit<SiderProps, 'collapsed' | 'onCollapse'>;
15
+ styles?: {
16
+ container?: CSSProperties;
17
+ };
14
18
  }
15
19
  export declare const PageLayout: (props: PageLayoutProps) => import("react/jsx-runtime").JSX.Element;
@@ -7,13 +7,14 @@ import { PageHeader } from "../PageHeader/index.js";
7
7
  import { PageContent } from "../PageContent/index.js";
8
8
  import { PageProvider, usePageContext } from "../PageProvider/index.js";
9
9
  const PageLayoutComponent = (props)=>{
10
- const { siderProps, sider, header, content, logo, pageRef } = props;
10
+ const { siderProps, sider, header, content, logo, pageRef, styles } = props;
11
11
  const context = usePageContext();
12
12
  const { collapsed, setCollapsed } = context;
13
13
  useImperativeHandle(pageRef, ()=>context, [
14
14
  context
15
15
  ]);
16
16
  return /*#__PURE__*/ jsxs(LayoutStyled, {
17
+ style: styles?.container,
17
18
  children: [
18
19
  /*#__PURE__*/ jsx(PageSider, {
19
20
  ...siderProps,
@@ -1,36 +1,56 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { Avatar, Image } from "antd";
3
3
  import { styled } from "styled-components";
4
+ import { usePageContext } from "../PageProvider/index.js";
4
5
  const PageLogo = (props)=>{
5
6
  const { src, icon, title } = props;
7
+ const { collapsed } = usePageContext();
8
+ const image = src && /*#__PURE__*/ jsx(Image, {
9
+ width: 22,
10
+ height: 22,
11
+ src: src,
12
+ preview: true
13
+ });
14
+ const avatar = icon && /*#__PURE__*/ jsx(Avatar, {
15
+ icon: icon,
16
+ shape: "circle",
17
+ size: 22
18
+ });
19
+ if (collapsed) return /*#__PURE__*/ jsx(LogoContentCollapseWrapper, {
20
+ children: image || avatar
21
+ });
6
22
  return /*#__PURE__*/ jsxs(LogoContentWrapper, {
7
23
  children: [
8
- src && /*#__PURE__*/ jsx(Image, {
9
- width: 30,
10
- height: 30,
11
- src: src,
12
- preview: true
13
- }),
14
- icon && /*#__PURE__*/ jsx(Avatar, {
15
- icon: icon,
16
- shape: "circle",
17
- size: 30
18
- }),
24
+ image || avatar,
19
25
  title && /*#__PURE__*/ jsx(TitleContentWrapper, {
20
26
  children: title
21
27
  })
22
28
  ]
23
29
  });
24
30
  };
31
+ const LogoContentCollapseWrapper = styled.div`
32
+ flex-shrink: 0;
33
+ flex-grow: 0;
34
+ display: flex;
35
+ align-items: center;
36
+ justify-content: center;
37
+ border-block-end: 1px solid rgba(0, 0, 0, 0.06);
38
+ height: 55px;
39
+ `;
25
40
  const LogoContentWrapper = styled.div`
26
- flex: 0;
41
+ flex-shrink: 0;
42
+ flex-grow: 0;
27
43
  display: flex;
28
44
  align-items: center;
29
- gap: 8px;
30
- height: 48px;
45
+ gap: 6px;
46
+ height: 55px;
47
+
48
+ border-block-end: 1px solid rgba(0, 0, 0, 0.06);
49
+ padding: 16px 12px;
31
50
  `;
32
51
  const TitleContentWrapper = styled.div`
33
52
  font-size: 16px;
53
+ line-height: 22px;
34
54
  font-weight: 600;
35
55
  color: #333;
36
56
  `;
@@ -0,0 +1 @@
1
+ export declare const IconCollapse: () => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,12 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ const IconCollapse = ()=>/*#__PURE__*/ jsx("svg", {
3
+ width: "1em",
4
+ height: "1em",
5
+ viewBox: "0 0 12 12",
6
+ fill: "currentColor",
7
+ "aria-hidden": "true",
8
+ children: /*#__PURE__*/ jsx("path", {
9
+ d: "M6.432 7.967a.448.448 0 01-.318.133h-.228a.46.46 0 01-.318-.133L2.488 4.85a.305.305 0 010-.43l.427-.43a.293.293 0 01.42 0L6 6.687l2.665-2.699a.299.299 0 01.426 0l.42.431a.305.305 0 010 .43L6.432 7.967z"
10
+ })
11
+ });
12
+ export { IconCollapse };
@@ -2,12 +2,15 @@ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { styled } from "styled-components";
3
3
  import { Layout } from "antd";
4
4
  import { PageLogo } from "../PageLogo/index.js";
5
+ import { IconCollapse } from "./IconCollapse.js";
6
+ import { usePageContext } from "../PageProvider/index.js";
5
7
  const PageSider = (props)=>{
6
8
  const { logo, children, ...siderProps } = props;
9
+ const { collapsed, setCollapsed } = usePageContext();
7
10
  return /*#__PURE__*/ jsx(SiderStyled, {
8
11
  trigger: null,
9
12
  width: 256,
10
- collapsedWidth: 80,
13
+ collapsedWidth: 48,
11
14
  breakpoint: "lg",
12
15
  collapsible: true,
13
16
  ...siderProps,
@@ -18,6 +21,11 @@ const PageSider = (props)=>{
18
21
  }),
19
22
  /*#__PURE__*/ jsx(SiderContentWrapper, {
20
23
  children: children
24
+ }),
25
+ /*#__PURE__*/ jsx(CollapseButton, {
26
+ collapsed: collapsed,
27
+ onClick: ()=>setCollapsed(!collapsed),
28
+ children: /*#__PURE__*/ jsx(IconCollapse, {})
21
29
  })
22
30
  ]
23
31
  })
@@ -29,7 +37,7 @@ const SiderStyled = styled(Layout.Sider)`
29
37
  display: flex;
30
38
  flex-direction: column;
31
39
 
32
- padding: 12px;
40
+ padding: 0px 8px;
33
41
  `;
34
42
  const SiderContent = styled.div`
35
43
  display: flex;
@@ -41,4 +49,31 @@ const SiderContentWrapper = styled.div`
41
49
  flex: 1;
42
50
  overflow: auto;
43
51
  `;
52
+ const CollapseButton = styled.div`
53
+ position: absolute;
54
+ inset-block-start: 18px;
55
+ z-index: 101;
56
+ width: 24px;
57
+ height: 24px;
58
+ text-align: center;
59
+ border-radius: 40px;
60
+ inset-inline-end: -13px;
61
+ transition: transform 0.3s;
62
+ display: flex;
63
+ align-items: center;
64
+ justify-content: center;
65
+ cursor: pointer;
66
+ color: rgba(0, 0, 0, 0.25);
67
+ background-color: #ffffff;
68
+ box-shadow:
69
+ 0 2px 8px -2px rgba(0, 0, 0, 0.05),
70
+ 0 1px 4px -1px rgba(25, 15, 15, 0.07),
71
+ 0 0 1px 0 rgba(0, 0, 0, 0.08);
72
+
73
+ &:hover {
74
+ color: #000;
75
+ }
76
+
77
+ transform: ${({ collapsed })=>collapsed ? 'rotate(270deg)' : 'rotate(90deg)'};
78
+ `;
44
79
  export { PageSider };
@@ -0,0 +1,3 @@
1
+ export declare const IconSend: (props: {
2
+ size?: number;
3
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,22 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ const IconSend = (props)=>/*#__PURE__*/ jsx("svg", {
3
+ xmlns: "http://www.w3.org/2000/svg",
4
+ fill: "none",
5
+ version: "1.1",
6
+ width: props.size,
7
+ height: props.size,
8
+ fontSize: "13",
9
+ viewBox: "0 0 12 12",
10
+ children: /*#__PURE__*/ jsx("g", {
11
+ children: /*#__PURE__*/ jsx("g", {
12
+ children: /*#__PURE__*/ jsx("g", {
13
+ children: /*#__PURE__*/ jsx("path", {
14
+ d: "M2.5892448413452147,1.0731753672753905L10.443560641345215,5.01422785727539C10.992402441345215,5.292121857275391,11.212822441345216,5.961596457275391,10.927351941345215,6.504752157275391C10.826088941345215,6.718707057275391,10.655646341345214,6.8922681572753905,10.443560641345215,6.997385957275391L2.576614341345215,10.93654155727539C2.0189285413452147,11.20812095727539,1.3450336413452149,10.98707095727539,1.0620861013452148,10.44454285727539C0.9361019133452149,10.18475245727539,0.9130878453452148,9.88691615727539,0.9976644513452149,9.61085795727539L1.857875821345215,6.830649357275391C1.9378719313452148,6.575499557275391,2.174690241345215,6.402173057275391,2.4420862413452147,6.4030685572753905L5.453454941345215,6.4030685572753905C5.676507941345215,6.401380557275391,5.857397041345215,6.221891357275391,5.860822641345215,5.99885845727539C5.859089841345215,5.775108357275391,5.6772108413452145,5.594640757275391,5.453454941345215,5.594647457275391L2.4439811413452146,5.594647457275391C2.175321541345215,5.595311157275391,1.9378442813452148,5.420153657275391,1.859139441345215,5.16328045727539L1.010297775345215,2.3735952572753907C0.8344821913452148,1.7857064572753907,1.1717939413452148,1.1672562972753906,1.7612447713452148,0.9967526872753907C2.0360918413452147,0.9105386212753906,2.334002541345215,0.9378270581753906,2.588612541345215,1.0725430872753907L2.5892448413452147,1.0731753672753905Z",
15
+ fill: "#FFFFFF",
16
+ "fill-opacity": "1"
17
+ })
18
+ })
19
+ })
20
+ })
21
+ });
22
+ export { IconSend };
@@ -1,10 +1,11 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { useRef, useState } from "react";
3
3
  import { Button, Divider, Dropdown } from "antd";
4
- import { ArrowUpOutlined, PauseCircleTwoTone } from "@ant-design/icons";
4
+ import { PauseCircleTwoTone } from "@ant-design/icons";
5
5
  import { EditorContent } from "../EditorContent/index.js";
6
- import { ChatInputBottom, ChatInputContent, ChatInputPanel } from "./styles.js";
6
+ import { ChatInputBottom, ChatInputContent, ChatInputPanel, ExtraContainer } from "./styles.js";
7
7
  import { useTrigger } from "./hooks/useTrigger.js";
8
+ import { IconSend } from "../../icons/IconSend.js";
8
9
  const ChatInput = (props)=>{
9
10
  const { style, className, placeholder, extra, actions, loading, onSubmit, skills = [] } = props;
10
11
  const ref = useRef(null);
@@ -44,7 +45,7 @@ const ChatInput = (props)=>{
44
45
  /*#__PURE__*/ jsx("div", {
45
46
  children: actions
46
47
  }),
47
- /*#__PURE__*/ jsxs("div", {
48
+ /*#__PURE__*/ jsxs(ExtraContainer, {
48
49
  children: [
49
50
  extra,
50
51
  extra && /*#__PURE__*/ jsx(Divider, {
@@ -60,7 +61,14 @@ const ChatInput = (props)=>{
60
61
  onClick: handleClickSend,
61
62
  onKeyDown: handleKeyDown,
62
63
  disabled: !inputValue && !loading,
63
- icon: loading ? /*#__PURE__*/ jsx(PauseCircleTwoTone, {}) : /*#__PURE__*/ jsx(ArrowUpOutlined, {})
64
+ style: {
65
+ display: 'inline-flex',
66
+ alignItems: 'center',
67
+ justifyContent: 'center'
68
+ },
69
+ children: loading ? /*#__PURE__*/ jsx(PauseCircleTwoTone, {}) : /*#__PURE__*/ jsx(IconSend, {
70
+ size: 16
71
+ })
64
72
  })
65
73
  ]
66
74
  })
@@ -1,3 +1,4 @@
1
1
  export declare const ChatInputPanel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
2
  export declare const ChatInputContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
3
3
  export declare const ChatInputBottom: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
4
+ export declare const ExtraContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -48,4 +48,9 @@ const ChatInputBottom = styled.div`
48
48
 
49
49
  flex-shrink: 0;
50
50
  `;
51
- export { ChatInputBottom, ChatInputContent, ChatInputPanel };
51
+ const ExtraContainer = styled.div`
52
+ display: flex;
53
+ align-items: center;
54
+ justify-content: center;
55
+ `;
56
+ export { ChatInputBottom, ChatInputContent, ChatInputPanel, ExtraContainer };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "listpage-next",
3
- "version": "0.0.193",
3
+ "version": "0.0.195",
4
4
  "description": "A React component library for creating filter forms with Ant Design",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",