@akinon/ui-layout 1.5.0 → 1.6.0

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.
Files changed (15) hide show
  1. package/dist/cjs/SubHeading/index.d.ts +11 -0
  2. package/dist/cjs/SubHeading/index.d.ts.map +1 -0
  3. package/dist/cjs/SubHeading/index.js +62 -0
  4. package/dist/cjs/SubHeading/types.d.ts +14 -0
  5. package/dist/cjs/index.d.ts +1 -0
  6. package/dist/cjs/index.d.ts.map +1 -1
  7. package/dist/cjs/index.js +1 -0
  8. package/dist/esm/SubHeading/index.d.ts +11 -0
  9. package/dist/esm/SubHeading/index.d.ts.map +1 -0
  10. package/dist/esm/SubHeading/index.js +58 -0
  11. package/dist/esm/SubHeading/types.d.ts +14 -0
  12. package/dist/esm/index.d.ts +1 -0
  13. package/dist/esm/index.d.ts.map +1 -1
  14. package/dist/esm/index.js +1 -0
  15. package/package.json +3 -3
package/dist/cjs/SubHeading/index.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import * as React from 'react';
2
+ import type { SubHeadingProps } from './types';
3
+ export type * from './types';
4
+ /**
5
+ * SubHeading component, which acts as a secondary heading within a layout.
6
+ * It provides a framework to integrate with other layout components cohesively.
7
+ *
8
+ * This component is commonly used in applications to establish a consistent and flexible sub-heading structure.
9
+ */
10
+ export declare const SubHeading: ({ children, action, className }: SubHeadingProps) => React.JSX.Element;
11
+ //# sourceMappingURL=index.d.ts.map
package/dist/cjs/SubHeading/index.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SubHeading/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,mBAAmB,SAAS,CAAC;AAE7B;;;;;GAKG;AAEH,eAAO,MAAM,UAAU,GAAI,iCAIxB,eAAe,sBA8DjB,CAAC"}
package/dist/cjs/SubHeading/index.js ADDED
@@ -0,0 +1,62 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SubHeading = void 0;
4
+ const ui_theme_1 = require("@akinon/ui-theme");
5
+ const ui_typography_1 = require("@akinon/ui-typography");
6
+ const cssinjs_1 = require("@ant-design/cssinjs");
7
+ const antd_1 = require("antd");
8
+ const clsx_1 = require("clsx");
9
+ const React = require("react");
10
+ /**
11
+ * SubHeading component, which acts as a secondary heading within a layout.
12
+ * It provides a framework to integrate with other layout components cohesively.
13
+ *
14
+ * This component is commonly used in applications to establish a consistent and flexible sub-heading structure.
15
+ */
16
+ const SubHeading = ({ children, action, className }) => {
17
+ const { getPrefixCls, theme } = React.useContext(antd_1.ConfigProvider.ConfigContext);
18
+ const { token } = (0, ui_theme_1.useToken)();
19
+ const prefixCls = `${getPrefixCls()}-sub-heading`;
20
+ const prefixClsSelector = `.${prefixCls}`;
21
+ (0, cssinjs_1.useStyleRegister)({
22
+ token: token,
23
+ path: ['SubHeading'],
24
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
25
+ theme: theme
26
+ }, () => {
27
+ const themeConfig = theme;
28
+ return {
29
+ [prefixClsSelector]: {
30
+ display: 'flex',
31
+ justifyContent: 'space-between',
32
+ alignItems: 'flex-end',
33
+ position: 'relative',
34
+ zIndex: 0,
35
+ '&::after': {
36
+ content: '""',
37
+ display: 'block',
38
+ width: '100%',
39
+ height: 1,
40
+ backgroundColor: themeConfig.colors.ebonyClay['400'],
41
+ position: 'absolute',
42
+ bottom: 1,
43
+ zIndex: -1
44
+ },
45
+ [`& .${getPrefixCls()}-typography`]: {
46
+ marginBottom: 0,
47
+ fontSize: token.fontSizeXL,
48
+ lineHeight: 'normal',
49
+ borderBottom: `4px solid ${themeConfig.colors.azure['500']}`,
50
+ paddingBlockEnd: token.paddingSM
51
+ },
52
+ [`&-action`]: {
53
+ paddingBlockEnd: token.paddingSM
54
+ }
55
+ }
56
+ };
57
+ });
58
+ return (React.createElement("div", { className: (0, clsx_1.default)(prefixCls, className) },
59
+ React.createElement(ui_typography_1.Title, { level: 3 }, children),
60
+ React.createElement("div", { className: `${prefixCls}-action` }, action)));
61
+ };
62
+ exports.SubHeading = SubHeading;
package/dist/cjs/SubHeading/types.d.ts ADDED
@@ -0,0 +1,14 @@
1
+ export type SubHeadingProps = {
2
+ /**
3
+ * The main content/title of the sub-heading
4
+ */
5
+ children: React.ReactNode;
6
+ /**
7
+ * Additional CSS class name for custom styling
8
+ */
9
+ className?: string;
10
+ /**
11
+ * Optional action element (e.g., button, link) displayed on the right side
12
+ */
13
+ action?: React.ReactNode;
14
+ };
package/dist/cjs/index.d.ts CHANGED
@@ -12,4 +12,5 @@ export * from './Grid';
12
12
  export * from './NavCard';
13
13
  export * from './PageContent';
14
14
  export * from './PageHeading';
15
+ export * from './SubHeading';
15
16
  //# sourceMappingURL=index.d.ts.map
package/dist/cjs/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,MAAM,EAAE,UAKZ,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,CAAC;AAElB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,MAAM,EAAE,UAKZ,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,CAAC;AAElB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC"}
package/dist/cjs/index.js CHANGED
@@ -32,3 +32,4 @@ __exportStar(require("./Grid"), exports);
32
32
  __exportStar(require("./NavCard"), exports);
33
33
  __exportStar(require("./PageContent"), exports);
34
34
  __exportStar(require("./PageHeading"), exports);
35
+ __exportStar(require("./SubHeading"), exports);
package/dist/esm/SubHeading/index.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import * as React from 'react';
2
+ import type { SubHeadingProps } from './types';
3
+ export type * from './types';
4
+ /**
5
+ * SubHeading component, which acts as a secondary heading within a layout.
6
+ * It provides a framework to integrate with other layout components cohesively.
7
+ *
8
+ * This component is commonly used in applications to establish a consistent and flexible sub-heading structure.
9
+ */
10
+ export declare const SubHeading: ({ children, action, className }: SubHeadingProps) => React.JSX.Element;
11
+ //# sourceMappingURL=index.d.ts.map
package/dist/esm/SubHeading/index.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SubHeading/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,mBAAmB,SAAS,CAAC;AAE7B;;;;;GAKG;AAEH,eAAO,MAAM,UAAU,GAAI,iCAIxB,eAAe,sBA8DjB,CAAC"}
package/dist/esm/SubHeading/index.js ADDED
@@ -0,0 +1,58 @@
1
+ import { useToken } from '@akinon/ui-theme';
2
+ import { Title } from '@akinon/ui-typography';
3
+ import { useStyleRegister } from '@ant-design/cssinjs';
4
+ import { ConfigProvider } from 'antd';
5
+ import clsx from 'clsx';
6
+ import * as React from 'react';
7
+ /**
8
+ * SubHeading component, which acts as a secondary heading within a layout.
9
+ * It provides a framework to integrate with other layout components cohesively.
10
+ *
11
+ * This component is commonly used in applications to establish a consistent and flexible sub-heading structure.
12
+ */
13
+ export const SubHeading = ({ children, action, className }) => {
14
+ const { getPrefixCls, theme } = React.useContext(ConfigProvider.ConfigContext);
15
+ const { token } = useToken();
16
+ const prefixCls = `${getPrefixCls()}-sub-heading`;
17
+ const prefixClsSelector = `.${prefixCls}`;
18
+ useStyleRegister({
19
+ token: token,
20
+ path: ['SubHeading'],
21
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
22
+ theme: theme
23
+ }, () => {
24
+ const themeConfig = theme;
25
+ return {
26
+ [prefixClsSelector]: {
27
+ display: 'flex',
28
+ justifyContent: 'space-between',
29
+ alignItems: 'flex-end',
30
+ position: 'relative',
31
+ zIndex: 0,
32
+ '&::after': {
33
+ content: '""',
34
+ display: 'block',
35
+ width: '100%',
36
+ height: 1,
37
+ backgroundColor: themeConfig.colors.ebonyClay['400'],
38
+ position: 'absolute',
39
+ bottom: 1,
40
+ zIndex: -1
41
+ },
42
+ [`& .${getPrefixCls()}-typography`]: {
43
+ marginBottom: 0,
44
+ fontSize: token.fontSizeXL,
45
+ lineHeight: 'normal',
46
+ borderBottom: `4px solid ${themeConfig.colors.azure['500']}`,
47
+ paddingBlockEnd: token.paddingSM
48
+ },
49
+ [`&-action`]: {
50
+ paddingBlockEnd: token.paddingSM
51
+ }
52
+ }
53
+ };
54
+ });
55
+ return (React.createElement("div", { className: clsx(prefixCls, className) },
56
+ React.createElement(Title, { level: 3 }, children),
57
+ React.createElement("div", { className: `${prefixCls}-action` }, action)));
58
+ };
package/dist/esm/SubHeading/types.d.ts ADDED
@@ -0,0 +1,14 @@
1
+ export type SubHeadingProps = {
2
+ /**
3
+ * The main content/title of the sub-heading
4
+ */
5
+ children: React.ReactNode;
6
+ /**
7
+ * Additional CSS class name for custom styling
8
+ */
9
+ className?: string;
10
+ /**
11
+ * Optional action element (e.g., button, link) displayed on the right side
12
+ */
13
+ action?: React.ReactNode;
14
+ };
package/dist/esm/index.d.ts CHANGED
@@ -12,4 +12,5 @@ export * from './Grid';
12
12
  export * from './NavCard';
13
13
  export * from './PageContent';
14
14
  export * from './PageHeading';
15
+ export * from './SubHeading';
15
16
  //# sourceMappingURL=index.d.ts.map
package/dist/esm/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,MAAM,EAAE,UAKZ,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,CAAC;AAElB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,MAAM,EAAE,UAKZ,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,CAAC;AAElB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC"}
package/dist/esm/index.js CHANGED
@@ -15,3 +15,4 @@ export * from './Grid';
15
15
  export * from './NavCard';
16
16
  export * from './PageContent';
17
17
  export * from './PageHeading';
18
+ export * from './SubHeading';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@akinon/ui-layout",
3
- "version": "1.5.0",
3
+ "version": "1.6.0",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "dist/esm/index.js",
@@ -13,7 +13,7 @@
13
13
  "antd": "^5.27.0",
14
14
  "clsx": "^2.0.0",
15
15
  "@akinon/icons": "1.1.0",
16
- "@akinon/ui-theme": "1.1.0",
16
+ "@akinon/ui-theme": "1.1.1",
17
17
  "@akinon/ui-typography": "1.1.0"
18
18
  },
19
19
  "devDependencies": {
@@ -22,7 +22,7 @@
22
22
  "rimraf": "^5.0.5",
23
23
  "typescript": "*",
24
24
  "@akinon/typescript-config": "1.1.0",
25
- "@akinon/utils": "1.1.0"
25
+ "@akinon/utils": "1.1.2"
26
26
  },
27
27
  "peerDependencies": {
28
28
  "react": "^18 || ^19",