@availity/mui-link 0.2.8 → 0.3.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.
- package/CHANGELOG.md +12 -0
- package/dist/index.d.mts +21 -0
- package/dist/index.d.ts +3 -3
- package/dist/index.js +49 -153
- package/dist/index.mjs +48 -174
- package/jest.config.js +10 -0
- package/package.json +7 -4
- package/project.json +8 -9
- package/src/lib/Link.stories.tsx +30 -2
- package/src/lib/Link.tsx +2 -3
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
|
|
4
4
|
|
|
5
|
+
## [0.3.0](https://github.com/Availity/element/compare/@availity/mui-link@0.2.9...@availity/mui-link@0.3.0) (2024-05-02)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
* **mui-link:** inline link styles ([7ee4587](https://github.com/Availity/element/commit/7ee458780be5cbb5ca97595aa7bf8bb7e3c36423))
|
|
11
|
+
|
|
12
|
+
## [0.2.9](https://github.com/Availity/element/compare/@availity/mui-link@0.2.8...@availity/mui-link@0.2.9) (2024-04-19)
|
|
13
|
+
|
|
14
|
+
### Dependency Updates
|
|
15
|
+
|
|
16
|
+
* `mui-icon` updated to version `0.2.8`
|
|
5
17
|
## [0.2.8](https://github.com/Availity/element/compare/@availity/mui-link@0.2.7...@availity/mui-link@0.2.8) (2024-04-04)
|
|
6
18
|
|
|
7
19
|
### Dependency Updates
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
import { LinkProps as LinkProps$1 } from '@mui/material/Link';
|
|
4
|
+
|
|
5
|
+
type LinkProps = {
|
|
6
|
+
/** Url of the page the link goes to */
|
|
7
|
+
href: string;
|
|
8
|
+
/** format href to leverage loadApp within home iframe when relative url used.
|
|
9
|
+
*
|
|
10
|
+
* @default true */
|
|
11
|
+
loadApp?: boolean;
|
|
12
|
+
/** Where to open the linked document. Adds `OpenInNewIcon` when target is `_blank` */
|
|
13
|
+
target?: string;
|
|
14
|
+
/** Function to run onClick of the link. The first argument passed to onClick is the event. The second argument is the processed url. */
|
|
15
|
+
onClick?: (event: React.MouseEvent, url: string) => void;
|
|
16
|
+
children?: ReactNode;
|
|
17
|
+
rel?: string;
|
|
18
|
+
} & Omit<LinkProps$1, 'underline' | 'noWrap' | 'variantMapping'>;
|
|
19
|
+
declare const Link: react.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
|
|
20
|
+
|
|
21
|
+
export { Link, type LinkProps };
|
package/dist/index.d.ts
CHANGED
|
@@ -15,7 +15,7 @@ type LinkProps = {
|
|
|
15
15
|
onClick?: (event: React.MouseEvent, url: string) => void;
|
|
16
16
|
children?: ReactNode;
|
|
17
17
|
rel?: string;
|
|
18
|
-
} & Omit<LinkProps$1, 'underline' | 'noWrap' | 'variantMapping'
|
|
19
|
-
declare const Link: react.ForwardRefExoticComponent<
|
|
18
|
+
} & Omit<LinkProps$1, 'underline' | 'noWrap' | 'variantMapping'>;
|
|
19
|
+
declare const Link: react.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
|
|
20
20
|
|
|
21
|
-
export { Link, LinkProps };
|
|
21
|
+
export { Link, type LinkProps };
|
package/dist/index.js
CHANGED
|
@@ -1,15 +1,38 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
+
var __defProps = Object.defineProperties;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
7
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
9
|
var __getProtoOf = Object.getPrototypeOf;
|
|
7
10
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var
|
|
9
|
-
|
|
11
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
+
var __spreadValues = (a, b) => {
|
|
14
|
+
for (var prop in b || (b = {}))
|
|
15
|
+
if (__hasOwnProp.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
if (__getOwnPropSymbols)
|
|
18
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
+
if (__propIsEnum.call(b, prop))
|
|
20
|
+
__defNormalProp(a, prop, b[prop]);
|
|
21
|
+
}
|
|
22
|
+
return a;
|
|
10
23
|
};
|
|
11
|
-
var
|
|
12
|
-
|
|
24
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
+
var __objRest = (source, exclude) => {
|
|
26
|
+
var target = {};
|
|
27
|
+
for (var prop in source)
|
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
+
target[prop] = source[prop];
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
13
36
|
};
|
|
14
37
|
var __export = (target, all) => {
|
|
15
38
|
for (var name in all)
|
|
@@ -24,153 +47,26 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
24
47
|
return to;
|
|
25
48
|
};
|
|
26
49
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
50
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
51
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
52
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
53
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
27
54
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
28
55
|
mod
|
|
29
56
|
));
|
|
30
57
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
31
58
|
|
|
32
|
-
// node_modules/tsup/assets/cjs_shims.js
|
|
33
|
-
var init_cjs_shims = __esm({
|
|
34
|
-
"node_modules/tsup/assets/cjs_shims.js"() {
|
|
35
|
-
}
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
// ../../node_modules/@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare.js
|
|
39
|
-
var require_faArrowUpRightFromSquare = __commonJS({
|
|
40
|
-
"../../node_modules/@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare.js"(exports) {
|
|
41
|
-
"use strict";
|
|
42
|
-
init_cjs_shims();
|
|
43
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
44
|
-
var prefix = "fas";
|
|
45
|
-
var iconName = "arrow-up-right-from-square";
|
|
46
|
-
var width = 512;
|
|
47
|
-
var height = 512;
|
|
48
|
-
var aliases = ["external-link"];
|
|
49
|
-
var unicode = "f08e";
|
|
50
|
-
var svgPathData = "M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32h82.7L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32H320zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z";
|
|
51
|
-
exports.definition = {
|
|
52
|
-
prefix,
|
|
53
|
-
iconName,
|
|
54
|
-
icon: [
|
|
55
|
-
width,
|
|
56
|
-
height,
|
|
57
|
-
aliases,
|
|
58
|
-
unicode,
|
|
59
|
-
svgPathData
|
|
60
|
-
]
|
|
61
|
-
};
|
|
62
|
-
exports.faArrowUpRightFromSquare = exports.definition;
|
|
63
|
-
exports.prefix = prefix;
|
|
64
|
-
exports.iconName = iconName;
|
|
65
|
-
exports.width = width;
|
|
66
|
-
exports.height = height;
|
|
67
|
-
exports.ligatures = aliases;
|
|
68
|
-
exports.unicode = unicode;
|
|
69
|
-
exports.svgPathData = svgPathData;
|
|
70
|
-
exports.aliases = aliases;
|
|
71
|
-
}
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
// ../../node_modules/@fortawesome/free-solid-svg-icons/faExternalLink.js
|
|
75
|
-
var require_faExternalLink = __commonJS({
|
|
76
|
-
"../../node_modules/@fortawesome/free-solid-svg-icons/faExternalLink.js"(exports) {
|
|
77
|
-
"use strict";
|
|
78
|
-
init_cjs_shims();
|
|
79
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
80
|
-
var source = require_faArrowUpRightFromSquare();
|
|
81
|
-
exports.definition = {
|
|
82
|
-
prefix: source.prefix,
|
|
83
|
-
iconName: source.iconName,
|
|
84
|
-
icon: [
|
|
85
|
-
source.width,
|
|
86
|
-
source.height,
|
|
87
|
-
source.aliases,
|
|
88
|
-
source.unicode,
|
|
89
|
-
source.svgPathData
|
|
90
|
-
]
|
|
91
|
-
};
|
|
92
|
-
exports.faExternalLink = exports.definition;
|
|
93
|
-
exports.prefix = source.prefix;
|
|
94
|
-
exports.iconName = source.iconName;
|
|
95
|
-
exports.width = source.width;
|
|
96
|
-
exports.height = source.height;
|
|
97
|
-
exports.ligatures = source.aliases;
|
|
98
|
-
exports.unicode = source.unicode;
|
|
99
|
-
exports.svgPathData = source.svgPathData;
|
|
100
|
-
exports.aliases = source.aliases;
|
|
101
|
-
}
|
|
102
|
-
});
|
|
103
|
-
|
|
104
59
|
// src/index.ts
|
|
105
60
|
var src_exports = {};
|
|
106
61
|
__export(src_exports, {
|
|
107
62
|
Link: () => Link
|
|
108
63
|
});
|
|
109
64
|
module.exports = __toCommonJS(src_exports);
|
|
110
|
-
init_cjs_shims();
|
|
111
65
|
|
|
112
66
|
// src/lib/Link.tsx
|
|
113
|
-
init_cjs_shims();
|
|
114
67
|
var import_react = require("react");
|
|
115
68
|
var import_Link = __toESM(require("@mui/material/Link"));
|
|
116
|
-
|
|
117
|
-
// ../icon/src/index.ts
|
|
118
|
-
init_cjs_shims();
|
|
119
|
-
|
|
120
|
-
// ../icon/src/lib/Icons/Actions.tsx
|
|
121
|
-
init_cjs_shims();
|
|
122
|
-
|
|
123
|
-
// ../icon/src/lib/FaSvgIcon.tsx
|
|
124
|
-
init_cjs_shims();
|
|
125
|
-
var React = __toESM(require("react"));
|
|
126
|
-
var import_SvgIcon = __toESM(require("@mui/material/SvgIcon"));
|
|
127
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
128
|
-
var FaSvgIcon = React.forwardRef((props, ref) => {
|
|
129
|
-
const { icon, ...svgProps } = props;
|
|
130
|
-
const {
|
|
131
|
-
icon: [width, height, , , svgPathData]
|
|
132
|
-
} = icon;
|
|
133
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SvgIcon.default, {
|
|
134
|
-
ref,
|
|
135
|
-
viewBox: `0 0 ${width} ${height}`,
|
|
136
|
-
...svgProps,
|
|
137
|
-
children: typeof svgPathData === "string" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", {
|
|
138
|
-
d: svgPathData
|
|
139
|
-
}) : null
|
|
140
|
-
});
|
|
141
|
-
});
|
|
142
|
-
|
|
143
|
-
// ../icon/src/lib/Icons/Actions.tsx
|
|
144
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
145
|
-
|
|
146
|
-
// ../icon/src/lib/Icons/Common.tsx
|
|
147
|
-
init_cjs_shims();
|
|
148
|
-
var import_faExternalLink = __toESM(require_faExternalLink());
|
|
149
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
150
|
-
var OpenInNewIcon = ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FaSvgIcon, {
|
|
151
|
-
icon: import_faExternalLink.faExternalLink,
|
|
152
|
-
"aria-hidden": false,
|
|
153
|
-
titleAccess: "(opens in new window)",
|
|
154
|
-
...props
|
|
155
|
-
});
|
|
156
|
-
|
|
157
|
-
// ../icon/src/lib/Icons/Files.tsx
|
|
158
|
-
init_cjs_shims();
|
|
159
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
160
|
-
|
|
161
|
-
// ../icon/src/lib/Icons/Form.tsx
|
|
162
|
-
init_cjs_shims();
|
|
163
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
164
|
-
|
|
165
|
-
// ../icon/src/lib/Icons/Navigation.tsx
|
|
166
|
-
init_cjs_shims();
|
|
167
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
168
|
-
|
|
169
|
-
// ../icon/src/lib/Icons/Payment.tsx
|
|
170
|
-
init_cjs_shims();
|
|
171
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
172
|
-
|
|
173
|
-
// src/lib/Link.tsx
|
|
69
|
+
var import_mui_icon = require("@availity/mui-icon");
|
|
174
70
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
175
71
|
var ABSOLUTE_URL_REGEX = /^[a-zA-Z][a-zA-Z\d+\-.]*?:/;
|
|
176
72
|
var WINDOWS_PATH_REGEX = /^[a-zA-Z]:\\/;
|
|
@@ -198,27 +94,27 @@ var setRel = (url, target, absolute) => {
|
|
|
198
94
|
return void 0;
|
|
199
95
|
};
|
|
200
96
|
var Link = (0, import_react.forwardRef)((props, ref) => {
|
|
201
|
-
const { href, target = "_self", children, onClick, loadApp = true, rel,
|
|
97
|
+
const _a = props, { href, target = "_self", children, onClick, loadApp = true, rel } = _a, rest = __objRest(_a, ["href", "target", "children", "onClick", "loadApp", "rel"]);
|
|
202
98
|
const absolute = isAbsoluteUrl(href);
|
|
203
99
|
const encode = !(absolute || !loadApp);
|
|
204
100
|
const url = encode ? getUrl(href) : href;
|
|
205
|
-
const NewWindowIcon = target === "_blank" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(OpenInNewIcon, {}) : null;
|
|
206
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
children: [
|
|
216
|
-
|
|
217
|
-
"
|
|
218
|
-
|
|
219
|
-
]
|
|
101
|
+
const NewWindowIcon = target === "_blank" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_icon.OpenInNewIcon, {}) : null;
|
|
102
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
103
|
+
import_Link.default,
|
|
104
|
+
__spreadProps(__spreadValues({
|
|
105
|
+
href: url,
|
|
106
|
+
target,
|
|
107
|
+
onClick: (event) => onClick && onClick(event, url),
|
|
108
|
+
rel: rel || setRel(url, target, absolute)
|
|
109
|
+
}, rest), {
|
|
110
|
+
ref,
|
|
111
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
|
|
112
|
+
NewWindowIcon,
|
|
113
|
+
" ",
|
|
114
|
+
children
|
|
115
|
+
] })
|
|
220
116
|
})
|
|
221
|
-
|
|
117
|
+
);
|
|
222
118
|
});
|
|
223
119
|
// Annotate the CommonJS export names for ESM import in node:
|
|
224
120
|
0 && (module.exports = {
|
package/dist/index.mjs
CHANGED
|
@@ -1,166 +1,40 @@
|
|
|
1
|
-
var __create = Object.create;
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
var
|
|
11
|
-
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
12
18
|
};
|
|
13
|
-
var
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
20
31
|
};
|
|
21
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
23
|
-
mod
|
|
24
|
-
));
|
|
25
|
-
|
|
26
|
-
// node_modules/tsup/assets/esm_shims.js
|
|
27
|
-
var init_esm_shims = __esm({
|
|
28
|
-
"node_modules/tsup/assets/esm_shims.js"() {
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
// ../../node_modules/@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare.js
|
|
33
|
-
var require_faArrowUpRightFromSquare = __commonJS({
|
|
34
|
-
"../../node_modules/@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare.js"(exports) {
|
|
35
|
-
"use strict";
|
|
36
|
-
init_esm_shims();
|
|
37
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
|
-
var prefix = "fas";
|
|
39
|
-
var iconName = "arrow-up-right-from-square";
|
|
40
|
-
var width = 512;
|
|
41
|
-
var height = 512;
|
|
42
|
-
var aliases = ["external-link"];
|
|
43
|
-
var unicode = "f08e";
|
|
44
|
-
var svgPathData = "M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32h82.7L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32H320zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z";
|
|
45
|
-
exports.definition = {
|
|
46
|
-
prefix,
|
|
47
|
-
iconName,
|
|
48
|
-
icon: [
|
|
49
|
-
width,
|
|
50
|
-
height,
|
|
51
|
-
aliases,
|
|
52
|
-
unicode,
|
|
53
|
-
svgPathData
|
|
54
|
-
]
|
|
55
|
-
};
|
|
56
|
-
exports.faArrowUpRightFromSquare = exports.definition;
|
|
57
|
-
exports.prefix = prefix;
|
|
58
|
-
exports.iconName = iconName;
|
|
59
|
-
exports.width = width;
|
|
60
|
-
exports.height = height;
|
|
61
|
-
exports.ligatures = aliases;
|
|
62
|
-
exports.unicode = unicode;
|
|
63
|
-
exports.svgPathData = svgPathData;
|
|
64
|
-
exports.aliases = aliases;
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
|
|
68
|
-
// ../../node_modules/@fortawesome/free-solid-svg-icons/faExternalLink.js
|
|
69
|
-
var require_faExternalLink = __commonJS({
|
|
70
|
-
"../../node_modules/@fortawesome/free-solid-svg-icons/faExternalLink.js"(exports) {
|
|
71
|
-
"use strict";
|
|
72
|
-
init_esm_shims();
|
|
73
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
74
|
-
var source = require_faArrowUpRightFromSquare();
|
|
75
|
-
exports.definition = {
|
|
76
|
-
prefix: source.prefix,
|
|
77
|
-
iconName: source.iconName,
|
|
78
|
-
icon: [
|
|
79
|
-
source.width,
|
|
80
|
-
source.height,
|
|
81
|
-
source.aliases,
|
|
82
|
-
source.unicode,
|
|
83
|
-
source.svgPathData
|
|
84
|
-
]
|
|
85
|
-
};
|
|
86
|
-
exports.faExternalLink = exports.definition;
|
|
87
|
-
exports.prefix = source.prefix;
|
|
88
|
-
exports.iconName = source.iconName;
|
|
89
|
-
exports.width = source.width;
|
|
90
|
-
exports.height = source.height;
|
|
91
|
-
exports.ligatures = source.aliases;
|
|
92
|
-
exports.unicode = source.unicode;
|
|
93
|
-
exports.svgPathData = source.svgPathData;
|
|
94
|
-
exports.aliases = source.aliases;
|
|
95
|
-
}
|
|
96
|
-
});
|
|
97
|
-
|
|
98
|
-
// src/index.ts
|
|
99
|
-
init_esm_shims();
|
|
100
32
|
|
|
101
33
|
// src/lib/Link.tsx
|
|
102
|
-
|
|
103
|
-
import { forwardRef as forwardRef2 } from "react";
|
|
34
|
+
import { forwardRef } from "react";
|
|
104
35
|
import { default as MuiLink } from "@mui/material/Link";
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
init_esm_shims();
|
|
108
|
-
|
|
109
|
-
// ../icon/src/lib/Icons/Actions.tsx
|
|
110
|
-
init_esm_shims();
|
|
111
|
-
|
|
112
|
-
// ../icon/src/lib/FaSvgIcon.tsx
|
|
113
|
-
init_esm_shims();
|
|
114
|
-
import * as React from "react";
|
|
115
|
-
import SvgIcon from "@mui/material/SvgIcon";
|
|
116
|
-
import { jsx } from "react/jsx-runtime";
|
|
117
|
-
var FaSvgIcon = React.forwardRef((props, ref) => {
|
|
118
|
-
const { icon, ...svgProps } = props;
|
|
119
|
-
const {
|
|
120
|
-
icon: [width, height, , , svgPathData]
|
|
121
|
-
} = icon;
|
|
122
|
-
return /* @__PURE__ */ jsx(SvgIcon, {
|
|
123
|
-
ref,
|
|
124
|
-
viewBox: `0 0 ${width} ${height}`,
|
|
125
|
-
...svgProps,
|
|
126
|
-
children: typeof svgPathData === "string" ? /* @__PURE__ */ jsx("path", {
|
|
127
|
-
d: svgPathData
|
|
128
|
-
}) : null
|
|
129
|
-
});
|
|
130
|
-
});
|
|
131
|
-
|
|
132
|
-
// ../icon/src/lib/Icons/Actions.tsx
|
|
133
|
-
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
134
|
-
|
|
135
|
-
// ../icon/src/lib/Icons/Common.tsx
|
|
136
|
-
init_esm_shims();
|
|
137
|
-
var import_faExternalLink = __toESM(require_faExternalLink());
|
|
138
|
-
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
139
|
-
var OpenInNewIcon = ({ ...props }) => /* @__PURE__ */ jsx3(FaSvgIcon, {
|
|
140
|
-
icon: import_faExternalLink.faExternalLink,
|
|
141
|
-
"aria-hidden": false,
|
|
142
|
-
titleAccess: "(opens in new window)",
|
|
143
|
-
...props
|
|
144
|
-
});
|
|
145
|
-
|
|
146
|
-
// ../icon/src/lib/Icons/Files.tsx
|
|
147
|
-
init_esm_shims();
|
|
148
|
-
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
149
|
-
|
|
150
|
-
// ../icon/src/lib/Icons/Form.tsx
|
|
151
|
-
init_esm_shims();
|
|
152
|
-
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
153
|
-
|
|
154
|
-
// ../icon/src/lib/Icons/Navigation.tsx
|
|
155
|
-
init_esm_shims();
|
|
156
|
-
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
157
|
-
|
|
158
|
-
// ../icon/src/lib/Icons/Payment.tsx
|
|
159
|
-
init_esm_shims();
|
|
160
|
-
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
161
|
-
|
|
162
|
-
// src/lib/Link.tsx
|
|
163
|
-
import { jsx as jsx8, jsxs } from "react/jsx-runtime";
|
|
36
|
+
import { OpenInNewIcon } from "@availity/mui-icon";
|
|
37
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
164
38
|
var ABSOLUTE_URL_REGEX = /^[a-zA-Z][a-zA-Z\d+\-.]*?:/;
|
|
165
39
|
var WINDOWS_PATH_REGEX = /^[a-zA-Z]:\\/;
|
|
166
40
|
function isAbsoluteUrl(url) {
|
|
@@ -186,28 +60,28 @@ var setRel = (url, target, absolute) => {
|
|
|
186
60
|
}
|
|
187
61
|
return void 0;
|
|
188
62
|
};
|
|
189
|
-
var Link =
|
|
190
|
-
const { href, target = "_self", children, onClick, loadApp = true, rel,
|
|
63
|
+
var Link = forwardRef((props, ref) => {
|
|
64
|
+
const _a = props, { href, target = "_self", children, onClick, loadApp = true, rel } = _a, rest = __objRest(_a, ["href", "target", "children", "onClick", "loadApp", "rel"]);
|
|
191
65
|
const absolute = isAbsoluteUrl(href);
|
|
192
66
|
const encode = !(absolute || !loadApp);
|
|
193
67
|
const url = encode ? getUrl(href) : href;
|
|
194
|
-
const NewWindowIcon = target === "_blank" ? /* @__PURE__ */
|
|
195
|
-
return /* @__PURE__ */
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
children: [
|
|
205
|
-
|
|
206
|
-
"
|
|
207
|
-
|
|
208
|
-
]
|
|
68
|
+
const NewWindowIcon = target === "_blank" ? /* @__PURE__ */ jsx(OpenInNewIcon, {}) : null;
|
|
69
|
+
return /* @__PURE__ */ jsx(
|
|
70
|
+
MuiLink,
|
|
71
|
+
__spreadProps(__spreadValues({
|
|
72
|
+
href: url,
|
|
73
|
+
target,
|
|
74
|
+
onClick: (event) => onClick && onClick(event, url),
|
|
75
|
+
rel: rel || setRel(url, target, absolute)
|
|
76
|
+
}, rest), {
|
|
77
|
+
ref,
|
|
78
|
+
children: /* @__PURE__ */ jsxs("span", { children: [
|
|
79
|
+
NewWindowIcon,
|
|
80
|
+
" ",
|
|
81
|
+
children
|
|
82
|
+
] })
|
|
209
83
|
})
|
|
210
|
-
|
|
84
|
+
);
|
|
211
85
|
});
|
|
212
86
|
export {
|
|
213
87
|
Link
|
package/jest.config.js
CHANGED
|
@@ -4,4 +4,14 @@ module.exports = {
|
|
|
4
4
|
...global,
|
|
5
5
|
displayName: 'link',
|
|
6
6
|
coverageDirectory: '../../coverage/link',
|
|
7
|
+
/* TODO: Update to latest Jest snapshotFormat
|
|
8
|
+
* By default Nx has kept the older style of Jest Snapshot formats
|
|
9
|
+
* to prevent breaking of any existing tests with snapshots.
|
|
10
|
+
* It's recommend you update to the latest format.
|
|
11
|
+
* You can do this by removing snapshotFormat property
|
|
12
|
+
* and running tests with --update-snapshot flag.
|
|
13
|
+
* Example: From within the project directory, run "nx test --update-snapshot"
|
|
14
|
+
* More info: https://jestjs.io/docs/upgrading-to-jest29#snapshot-format
|
|
15
|
+
*/
|
|
16
|
+
snapshotFormat: { escapeString: true, printBasicPrototype: true },
|
|
7
17
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@availity/mui-link",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Availity MUI Link Component - part of the @availity/element design system",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -32,11 +32,11 @@
|
|
|
32
32
|
"publish:canary": "yarn npm publish --access public --tag canary"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
|
-
"@mui/material": "^5.
|
|
35
|
+
"@mui/material": "^5.15.15",
|
|
36
36
|
"react": "18.2.0",
|
|
37
37
|
"react-dom": "18.2.0",
|
|
38
|
-
"tsup": "^
|
|
39
|
-
"typescript": "^4.
|
|
38
|
+
"tsup": "^8.0.2",
|
|
39
|
+
"typescript": "^5.4.5"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@mui/material": "^5.11.9",
|
|
@@ -44,5 +44,8 @@
|
|
|
44
44
|
},
|
|
45
45
|
"publishConfig": {
|
|
46
46
|
"access": "public"
|
|
47
|
+
},
|
|
48
|
+
"dependencies": {
|
|
49
|
+
"@availity/mui-icon": "^0.8.2"
|
|
47
50
|
}
|
|
48
51
|
}
|
package/project.json
CHANGED
|
@@ -6,10 +6,9 @@
|
|
|
6
6
|
"tags": [],
|
|
7
7
|
"targets": {
|
|
8
8
|
"lint": {
|
|
9
|
-
"executor": "@
|
|
9
|
+
"executor": "@nx/eslint:lint",
|
|
10
10
|
"options": {
|
|
11
11
|
"eslintConfig": ".eslintrc.json",
|
|
12
|
-
"lintFilePatterns": ["packages/link/**/*.{js,ts}"],
|
|
13
12
|
"silent": false,
|
|
14
13
|
"fix": false,
|
|
15
14
|
"cache": true,
|
|
@@ -22,20 +21,20 @@
|
|
|
22
21
|
}
|
|
23
22
|
},
|
|
24
23
|
"test": {
|
|
25
|
-
"executor": "@
|
|
26
|
-
"outputs": ["coverage/link"],
|
|
24
|
+
"executor": "@nx/jest:jest",
|
|
25
|
+
"outputs": ["{workspaceRoot}/coverage/link"],
|
|
27
26
|
"options": {
|
|
28
|
-
"jestConfig": "packages/link/jest.config.js"
|
|
29
|
-
"passWithNoTests": true
|
|
27
|
+
"jestConfig": "packages/link/jest.config.js"
|
|
30
28
|
}
|
|
31
29
|
},
|
|
32
30
|
"version": {
|
|
33
31
|
"executor": "@jscutlery/semver:version",
|
|
34
32
|
"options": {
|
|
35
33
|
"preset": "conventional",
|
|
36
|
-
"commitMessageFormat": "chore(
|
|
37
|
-
"tagPrefix": "@availity
|
|
38
|
-
"trackDeps": true
|
|
34
|
+
"commitMessageFormat": "chore({projectName}): release version ${version} [skip ci]",
|
|
35
|
+
"tagPrefix": "@availity/{projectName}@",
|
|
36
|
+
"trackDeps": true,
|
|
37
|
+
"skipCommitTypes": ["docs"]
|
|
39
38
|
}
|
|
40
39
|
}
|
|
41
40
|
}
|
package/src/lib/Link.stories.tsx
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
// eslint-disable-next-line @nx/enforce-module-boundaries
|
|
2
3
|
import { SystemPropsList } from '../../../../data/MuiSystemProperties';
|
|
3
4
|
import { Link, LinkProps } from './Link';
|
|
4
5
|
|
|
6
|
+
const excludedProps = [...SystemPropsList, "align"]
|
|
7
|
+
|
|
5
8
|
/**
|
|
6
9
|
* Simple link component that renders an `<a>` tag with the href formatted to leverage loadApp so the link gets loaded inside the home page's iframe
|
|
7
10
|
*
|
|
@@ -14,12 +17,12 @@ const meta: Meta<typeof Link> = {
|
|
|
14
17
|
parameters: {
|
|
15
18
|
docs: {
|
|
16
19
|
controls: {
|
|
17
|
-
exclude:
|
|
20
|
+
exclude: excludedProps,
|
|
18
21
|
},
|
|
19
22
|
},
|
|
20
23
|
canvas: {
|
|
21
24
|
controls: {
|
|
22
|
-
exclude:
|
|
25
|
+
exclude: excludedProps,
|
|
23
26
|
},
|
|
24
27
|
},
|
|
25
28
|
},
|
|
@@ -38,6 +41,17 @@ export const _Link: StoryObj<typeof Link> = {
|
|
|
38
41
|
},
|
|
39
42
|
};
|
|
40
43
|
|
|
44
|
+
/** Inline styling is achieved with the `inherit` variant. */
|
|
45
|
+
export const _Variants: StoryObj<typeof Link> = {
|
|
46
|
+
render: () => (
|
|
47
|
+
<div>
|
|
48
|
+
<Link href='#' gutterBottom>Medium standalone link (default)</Link><br />
|
|
49
|
+
<Link href='#' gutterBottom variant="body2">Small standalone link</Link><br />
|
|
50
|
+
<Link href='#' gutterBottom variant="inherit">Inline link</Link>
|
|
51
|
+
</div>
|
|
52
|
+
),
|
|
53
|
+
};
|
|
54
|
+
|
|
41
55
|
/** The `OpenInNewIcon` has an accessible name to tell screenreaders that it opens in a new window. */
|
|
42
56
|
export const _NewWindow: StoryObj<typeof Link> = {
|
|
43
57
|
render: (args: LinkProps) => <Link {...args} loadApp={false} target="_blank" />,
|
|
@@ -60,3 +74,17 @@ export const _RelativeUrl: StoryObj<typeof Link> = {
|
|
|
60
74
|
children: 'Portal App',
|
|
61
75
|
},
|
|
62
76
|
};
|
|
77
|
+
|
|
78
|
+
/** The `gutterBottom` prop achieves correct spacing for a list of links. */
|
|
79
|
+
export const _Lists: StoryObj<typeof Link> = {
|
|
80
|
+
render: () => (
|
|
81
|
+
<div>
|
|
82
|
+
<Link href='#' gutterBottom>Link 1</Link><br />
|
|
83
|
+
<Link href='#' gutterBottom>Link 2</Link><br />
|
|
84
|
+
<Link href='#' gutterBottom>Link 3</Link><br />
|
|
85
|
+
<Link href='#' gutterBottom>Link 4</Link><br />
|
|
86
|
+
<Link href='#' gutterBottom>Link 5</Link><br />
|
|
87
|
+
<Link href='#' gutterBottom>Link 6</Link><br />
|
|
88
|
+
</div>
|
|
89
|
+
),
|
|
90
|
+
};
|
package/src/lib/Link.tsx
CHANGED
|
@@ -53,7 +53,7 @@ export type LinkProps = {
|
|
|
53
53
|
onClick?: (event: React.MouseEvent, url: string) => void;
|
|
54
54
|
children?: ReactNode;
|
|
55
55
|
rel?: string;
|
|
56
|
-
} & Omit<MuiLinkProps, 'underline' | 'noWrap' | 'variantMapping'
|
|
56
|
+
} & Omit<MuiLinkProps, 'underline' | 'noWrap' | 'variantMapping' >;
|
|
57
57
|
|
|
58
58
|
export const Link = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {
|
|
59
59
|
const { href, target = '_self', children, onClick, loadApp = true, rel, ...rest } = props;
|
|
@@ -68,12 +68,11 @@ export const Link = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {
|
|
|
68
68
|
target={target}
|
|
69
69
|
onClick={(event: React.MouseEvent) => onClick && onClick(event, url)}
|
|
70
70
|
rel={rel || setRel(url, target, absolute)}
|
|
71
|
-
underline="hover"
|
|
72
71
|
{...rest}
|
|
73
72
|
ref={ref}
|
|
74
73
|
>
|
|
75
74
|
<span>
|
|
76
|
-
{
|
|
75
|
+
{NewWindowIcon} {children}
|
|
77
76
|
</span>
|
|
78
77
|
</MuiLink>
|
|
79
78
|
);
|