@xylabs/react-button 4.0.3 → 4.0.5
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/dist/browser/components/ButtonEx.d.ts +5 -0
- package/dist/browser/components/ButtonEx.d.ts.map +1 -0
- package/dist/browser/components/ButtonExBase.d.ts +5 -0
- package/dist/browser/components/ButtonExBase.d.ts.map +1 -0
- package/dist/browser/components/ButtonExProps.d.ts +10 -0
- package/dist/browser/components/ButtonExProps.d.ts.map +1 -0
- package/dist/browser/components/ButtonExTo.d.ts +5 -0
- package/dist/browser/components/ButtonExTo.d.ts.map +1 -0
- package/dist/browser/components/index.d.ts +3 -0
- package/dist/browser/components/index.d.ts.map +1 -0
- package/dist/browser/index.d.ts +2 -14
- package/dist/browser/index.d.ts.map +1 -0
- package/dist/browser/index.mjs.map +1 -1
- package/package.json +36 -36
- package/src/components/ButtonEx.stories.tsx +4 -6
- package/src/components/ButtonExBase.tsx +6 -2
- package/src/components/ButtonExTo.tsx +3 -1
- package/xy.config.ts +1 -3
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonEx.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonEx.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAGxD,QAAA,MAAM,QAAQ,yFAEZ,CAAA;AAIF,OAAO,EAAE,QAAQ,EAAE,CAAA"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ButtonExProps } from './ButtonExProps.tsx';
|
|
3
|
+
declare const ButtonExBase: React.ForwardRefExoticComponent<ButtonExProps & React.RefAttributes<HTMLButtonElement>>;
|
|
4
|
+
export { ButtonExBase };
|
|
5
|
+
//# sourceMappingURL=ButtonExBase.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonExBase.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonExBase.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAExD,QAAA,MAAM,YAAY,yFAuBhB,CAAA;AAIF,OAAO,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { ButtonProps } from '@mui/material';
|
|
2
|
+
import type { BoxlikeComponentProps, BusyProps } from '@xylabs/react-shared';
|
|
3
|
+
import type { NavigateOptions, To } from 'react-router-dom';
|
|
4
|
+
interface ButtonExProps extends Omit<ButtonProps, 'ref'>, BoxlikeComponentProps, BusyProps {
|
|
5
|
+
target?: string;
|
|
6
|
+
to?: To;
|
|
7
|
+
toOptions?: NavigateOptions;
|
|
8
|
+
}
|
|
9
|
+
export type { ButtonExProps };
|
|
10
|
+
//# sourceMappingURL=ButtonExProps.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonExProps.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonExProps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAA;AAC5E,OAAO,KAAK,EAAE,eAAe,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAE3D,UAAU,aAAc,SAAQ,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,EAAE,qBAAqB,EAAE,SAAS;IACxF,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,SAAS,CAAC,EAAE,eAAe,CAAA;CAC5B;AAED,YAAY,EAAE,aAAa,EAAE,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonExTo.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonExTo.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAIzC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAExD,QAAA,MAAM,UAAU,yFAYd,CAAA;AAIF,OAAO,EAAE,UAAU,EAAE,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,qBAAqB,CAAA"}
|
package/dist/browser/index.d.ts
CHANGED
|
@@ -1,14 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { BoxlikeComponentProps, BusyProps } from '@xylabs/react-shared';
|
|
4
|
-
import { To, NavigateOptions } from 'react-router-dom';
|
|
5
|
-
|
|
6
|
-
interface ButtonExProps extends Omit<ButtonProps, 'ref'>, BoxlikeComponentProps, BusyProps {
|
|
7
|
-
target?: string;
|
|
8
|
-
to?: To;
|
|
9
|
-
toOptions?: NavigateOptions;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
declare const ButtonEx: React.ForwardRefExoticComponent<ButtonExProps & React.RefAttributes<HTMLButtonElement>>;
|
|
13
|
-
|
|
14
|
-
export { ButtonEx, type ButtonExProps };
|
|
1
|
+
export * from './components/index.ts';
|
|
2
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/ButtonEx.tsx","../../src/components/ButtonExBase.tsx","../../src/components/ButtonExTo.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { ButtonExBase } from './ButtonExBase.tsx'\nimport type { ButtonExProps } from './ButtonExProps.tsx'\nimport { ButtonToEx } from './ButtonExTo.tsx'\n\nconst ButtonEx = forwardRef<HTMLButtonElement, ButtonExProps>(({ to, ...props }, ref) => {\n return to ? <ButtonToEx to={to} ref={ref} {...props} /> : <ButtonExBase {...props} />\n})\n\nButtonEx.displayName = 'ButtonExXYLabs'\n\nexport { ButtonEx }\n","import { Button, useTheme } from '@mui/material'\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/components/ButtonEx.tsx","../../src/components/ButtonExBase.tsx","../../src/components/ButtonExTo.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { ButtonExBase } from './ButtonExBase.tsx'\nimport type { ButtonExProps } from './ButtonExProps.tsx'\nimport { ButtonToEx } from './ButtonExTo.tsx'\n\nconst ButtonEx = forwardRef<HTMLButtonElement, ButtonExProps>(({ to, ...props }, ref) => {\n return to ? <ButtonToEx to={to} ref={ref} {...props} /> : <ButtonExBase {...props} />\n})\n\nButtonEx.displayName = 'ButtonExXYLabs'\n\nexport { ButtonEx }\n","import { Button, useTheme } from '@mui/material'\nimport {\n BusyCircularProgress, BusyLinearProgress, mergeBoxlikeStyles,\n} from '@xylabs/react-shared'\nimport type { MouseEvent } from 'react'\nimport React, { forwardRef } from 'react'\n\nimport type { ButtonExProps } from './ButtonExProps.tsx'\n\nconst ButtonExBase = forwardRef<HTMLButtonElement, ButtonExProps>((props, ref) => {\n const theme = useTheme()\n const {\n busy, busyVariant = 'linear', busyOpacity, onClick, children, ...rootProps\n } = mergeBoxlikeStyles<ButtonExProps>(theme, props)\n\n const localOnClick = (event: MouseEvent<HTMLButtonElement>) => {\n if (!busy) {\n onClick?.(event)\n }\n }\n\n return (\n <Button ref={ref} onClick={localOnClick} {...rootProps}>\n {busy && busyVariant === 'linear'\n ? <BusyLinearProgress rounded opacity={busyOpacity ?? 0} />\n : null}\n {busy && busyVariant === 'circular'\n ? <BusyCircularProgress rounded size={24} opacity={busyOpacity ?? 0.5} />\n : null}\n {children}\n </Button>\n )\n})\n\nButtonExBase.displayName = 'ButtonExBaseXYLabs'\n\nexport { ButtonExBase }\n","import type { MouseEvent } from 'react'\nimport React, { forwardRef } from 'react'\nimport { useNavigate } from 'react-router-dom'\n\nimport { ButtonExBase } from './ButtonExBase.tsx'\nimport type { ButtonExProps } from './ButtonExProps.tsx'\n\nconst ButtonToEx = forwardRef<HTMLButtonElement, ButtonExProps>(({\n to, toOptions, onClick, ...props\n}, ref) => {\n const navigate = useNavigate()\n const localOnClick = (event: MouseEvent<HTMLButtonElement>) => {\n onClick?.(event)\n if (to) {\n navigate(to, toOptions)\n }\n }\n\n return <ButtonExBase ref={ref} onClick={localOnClick} {...props} />\n})\n\nButtonToEx.displayName = 'ButtonToExXYLabs'\n\nexport { ButtonToEx }\n"],"mappings":";;;;AAAA,OAAOA,UAASC,cAAAA,mBAAkB;;;ACAlC,SAASC,QAAQC,gBAAgB;AACjC,SACEC,sBAAsBC,oBAAoBC,0BACrC;AAEP,OAAOC,SAASC,kBAAkB;AAIlC,IAAMC,eAAeC,2BAA6C,CAACC,OAAOC,QAAAA;AACxE,QAAMC,QAAQC,SAAAA;AACd,QAAM,EACJC,MAAMC,cAAc,UAAUC,aAAaC,SAASC,UAAU,GAAGC,UAAAA,IAC/DC,mBAAkCR,OAAOF,KAAAA;AAE7C,QAAMW,eAAe,wBAACC,UAAAA;AACpB,QAAI,CAACR,MAAM;AACTG,gBAAUK,KAAAA;IACZ;EACF,GAJqB;AAMrB,SACE,sBAAA,cAACC,QAAAA;IAAOZ;IAAUM,SAASI;IAAe,GAAGF;KAC1CL,QAAQC,gBAAgB,WACrB,sBAAA,cAACS,oBAAAA;IAAmBC,SAAAA;IAAQC,SAASV,eAAe;OACpD,MACHF,QAAQC,gBAAgB,aACrB,sBAAA,cAACY,sBAAAA;IAAqBF,SAAAA;IAAQG,MAAM;IAAIF,SAASV,eAAe;OAChE,MACHE,QAAAA;AAGP,CAAA;AAEAV,aAAaqB,cAAc;;;ACjC3B,OAAOC,UAASC,cAAAA,mBAAkB;AAClC,SAASC,mBAAmB;AAK5B,IAAMC,aAAaC,gBAAAA,YAA6C,CAAC,EAC/DC,IAAIC,WAAWC,SAAS,GAAGC,MAAAA,GAC1BC,QAAAA;AACD,QAAMC,WAAWC,YAAAA;AACjB,QAAMC,eAAe,wBAACC,UAAAA;AACpBN,cAAUM,KAAAA;AACV,QAAIR,IAAI;AACNK,eAASL,IAAIC,SAAAA;IACf;EACF,GALqB;AAOrB,SAAO,gBAAAQ,OAAA,cAACC,cAAAA;IAAaN;IAAUF,SAASK;IAAe,GAAGJ;;AAC5D,CAAA;AAEAL,WAAWa,cAAc;;;AFfzB,IAAMC,WAAWC,gBAAAA,YAA6C,CAAC,EAAEC,IAAI,GAAGC,MAAAA,GAASC,QAAAA;AAC/E,SAAOF,KAAK,gBAAAG,OAAA,cAACC,YAAAA;IAAWJ;IAAQE;IAAW,GAAGD;OAAY,gBAAAE,OAAA,cAACE,cAAiBJ,KAAAA;AAC9E,CAAA;AAEAH,SAASQ,cAAc;","names":["React","forwardRef","Button","useTheme","BusyCircularProgress","BusyLinearProgress","mergeBoxlikeStyles","React","forwardRef","ButtonExBase","forwardRef","props","ref","theme","useTheme","busy","busyVariant","busyOpacity","onClick","children","rootProps","mergeBoxlikeStyles","localOnClick","event","Button","BusyLinearProgress","rounded","opacity","BusyCircularProgress","size","displayName","React","forwardRef","useNavigate","ButtonToEx","forwardRef","to","toOptions","onClick","props","ref","navigate","useNavigate","localOnClick","event","React","ButtonExBase","displayName","ButtonEx","forwardRef","to","props","ref","React","ButtonToEx","ButtonExBase","displayName"]}
|
package/package.json
CHANGED
|
@@ -1,63 +1,63 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xylabs/react-button",
|
|
3
|
+
"version": "4.0.5",
|
|
4
|
+
"description": "Common React library for all XY Labs projects that use React",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"utility",
|
|
7
|
+
"typescript",
|
|
8
|
+
"react"
|
|
9
|
+
],
|
|
10
|
+
"homepage": "https://xylabs.com",
|
|
11
|
+
"bugs": {
|
|
12
|
+
"url": "git+https://github.com/xylabs/sdk-react/issues",
|
|
13
|
+
"email": "support@xylabs.com"
|
|
14
|
+
},
|
|
15
|
+
"repository": {
|
|
16
|
+
"type": "git",
|
|
17
|
+
"url": "git+https://github.com/xylabs/sdk-react.git"
|
|
18
|
+
},
|
|
19
|
+
"license": "LGPL-3.0-only",
|
|
3
20
|
"author": {
|
|
4
|
-
"email": "support@xylabs.com",
|
|
5
21
|
"name": "XY Labs Development Team",
|
|
22
|
+
"email": "support@xylabs.com",
|
|
6
23
|
"url": "https://xylabs.com"
|
|
7
24
|
},
|
|
8
|
-
"
|
|
9
|
-
|
|
10
|
-
|
|
25
|
+
"sideEffects": false,
|
|
26
|
+
"type": "module",
|
|
27
|
+
"exports": {
|
|
28
|
+
".": {
|
|
29
|
+
"types": "./dist/browser/index.d.ts",
|
|
30
|
+
"default": "./dist/browser/index.mjs"
|
|
31
|
+
},
|
|
32
|
+
"./package.json": "./package.json"
|
|
11
33
|
},
|
|
34
|
+
"module": "./dist/browser/index.mjs",
|
|
35
|
+
"types": "dist/browser/index.d.ts",
|
|
12
36
|
"workspaces": [
|
|
13
37
|
"packages/*"
|
|
14
38
|
],
|
|
15
39
|
"dependencies": {
|
|
16
|
-
"@xylabs/react-shared": "^4.0.
|
|
40
|
+
"@xylabs/react-shared": "^4.0.5",
|
|
17
41
|
"react-router-dom": "^6.26.1"
|
|
18
42
|
},
|
|
19
|
-
"description": "Common React library for all XY Labs projects that use React",
|
|
20
43
|
"devDependencies": {
|
|
21
|
-
"@mui/material": "^
|
|
44
|
+
"@mui/material": "^6.0.1",
|
|
22
45
|
"@storybook/react": "^8.2.9",
|
|
23
|
-
"@types/react": "^18.3.
|
|
24
|
-
"@xylabs/react-flexbox": "^4.0.
|
|
25
|
-
"@xylabs/ts-scripts-yarn3": "^4.0.
|
|
26
|
-
"@xylabs/tsconfig-react": "^4.0.
|
|
46
|
+
"@types/react": "^18.3.5",
|
|
47
|
+
"@xylabs/react-flexbox": "^4.0.5",
|
|
48
|
+
"@xylabs/ts-scripts-yarn3": "^4.0.7",
|
|
49
|
+
"@xylabs/tsconfig-react": "^4.0.7",
|
|
27
50
|
"react": "^18.3.1",
|
|
28
51
|
"react-dom": "^18.3.1",
|
|
29
52
|
"storybook": "^8.2.9",
|
|
30
53
|
"typescript": "^5.5.4"
|
|
31
54
|
},
|
|
32
55
|
"peerDependencies": {
|
|
33
|
-
"@mui/material": "
|
|
56
|
+
"@mui/material": ">5",
|
|
34
57
|
"react": "^18",
|
|
35
58
|
"react-dom": "^18"
|
|
36
59
|
},
|
|
37
|
-
"exports": {
|
|
38
|
-
".": {
|
|
39
|
-
"types": "./dist/browser/index.d.ts",
|
|
40
|
-
"default": "./dist/browser/index.mjs"
|
|
41
|
-
},
|
|
42
|
-
"./package.json": "./package.json"
|
|
43
|
-
},
|
|
44
|
-
"types": "dist/browser/index.d.ts",
|
|
45
|
-
"module": "./dist/browser/index.mjs",
|
|
46
|
-
"homepage": "https://xylabs.com",
|
|
47
|
-
"keywords": [
|
|
48
|
-
"utility",
|
|
49
|
-
"typescript",
|
|
50
|
-
"react"
|
|
51
|
-
],
|
|
52
|
-
"license": "LGPL-3.0-only",
|
|
53
60
|
"publishConfig": {
|
|
54
61
|
"access": "public"
|
|
55
|
-
}
|
|
56
|
-
"repository": {
|
|
57
|
-
"type": "git",
|
|
58
|
-
"url": "git+https://github.com/xylabs/sdk-react.git"
|
|
59
|
-
},
|
|
60
|
-
"sideEffects": false,
|
|
61
|
-
"version": "4.0.3",
|
|
62
|
-
"type": "module"
|
|
62
|
+
}
|
|
63
63
|
}
|
|
@@ -7,11 +7,7 @@ import { ButtonEx } from './ButtonEx.tsx'
|
|
|
7
7
|
const StorybookEntry = {
|
|
8
8
|
argTypes: {},
|
|
9
9
|
component: ButtonEx,
|
|
10
|
-
parameters: {
|
|
11
|
-
docs: {
|
|
12
|
-
page: null,
|
|
13
|
-
},
|
|
14
|
-
},
|
|
10
|
+
parameters: { docs: { page: null } },
|
|
15
11
|
title: 'button/ButtonEx',
|
|
16
12
|
} as Meta<typeof ButtonEx>
|
|
17
13
|
|
|
@@ -42,6 +38,8 @@ BusyCircular.args = { busy: true, busyVariant: 'circular' }
|
|
|
42
38
|
const BusyLinear = DefaultTemplate.bind({})
|
|
43
39
|
BusyLinear.args = { busy: true, busyVariant: 'linear' }
|
|
44
40
|
|
|
45
|
-
export {
|
|
41
|
+
export {
|
|
42
|
+
BusyCircular, BusyLinear, Default,
|
|
43
|
+
}
|
|
46
44
|
|
|
47
45
|
export default StorybookEntry
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { Button, useTheme } from '@mui/material'
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
BusyCircularProgress, BusyLinearProgress, mergeBoxlikeStyles,
|
|
4
|
+
} from '@xylabs/react-shared'
|
|
3
5
|
import type { MouseEvent } from 'react'
|
|
4
6
|
import React, { forwardRef } from 'react'
|
|
5
7
|
|
|
@@ -7,7 +9,9 @@ import type { ButtonExProps } from './ButtonExProps.tsx'
|
|
|
7
9
|
|
|
8
10
|
const ButtonExBase = forwardRef<HTMLButtonElement, ButtonExProps>((props, ref) => {
|
|
9
11
|
const theme = useTheme()
|
|
10
|
-
const {
|
|
12
|
+
const {
|
|
13
|
+
busy, busyVariant = 'linear', busyOpacity, onClick, children, ...rootProps
|
|
14
|
+
} = mergeBoxlikeStyles<ButtonExProps>(theme, props)
|
|
11
15
|
|
|
12
16
|
const localOnClick = (event: MouseEvent<HTMLButtonElement>) => {
|
|
13
17
|
if (!busy) {
|
|
@@ -5,7 +5,9 @@ import { useNavigate } from 'react-router-dom'
|
|
|
5
5
|
import { ButtonExBase } from './ButtonExBase.tsx'
|
|
6
6
|
import type { ButtonExProps } from './ButtonExProps.tsx'
|
|
7
7
|
|
|
8
|
-
const ButtonToEx = forwardRef<HTMLButtonElement, ButtonExProps>(({
|
|
8
|
+
const ButtonToEx = forwardRef<HTMLButtonElement, ButtonExProps>(({
|
|
9
|
+
to, toOptions, onClick, ...props
|
|
10
|
+
}, ref) => {
|
|
9
11
|
const navigate = useNavigate()
|
|
10
12
|
const localOnClick = (event: MouseEvent<HTMLButtonElement>) => {
|
|
11
13
|
onClick?.(event)
|