@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.
Files changed (10) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/index.d.mts +21 -0
  3. package/dist/index.d.ts +3 -3
  4. package/dist/index.js +49 -153
  5. package/dist/index.mjs +48 -174
  6. package/jest.config.js +10 -0
  7. package/package.json +7 -4
  8. package/project.json +8 -9
  9. package/src/lib/Link.stories.tsx +30 -2
  10. 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' | 'variant'>;
19
- declare const Link: react.ForwardRefExoticComponent<Pick<LinkProps, "className" | "style" | "classes" | "children" | "color" | "fontSize" | "sx" | "p" | "slot" | "title" | "height" | "id" | "lang" | "media" | "target" | "type" | "width" | "role" | "tabIndex" | "display" | "fontFamily" | "fontStyle" | "fontWeight" | "href" | "letterSpacing" | "order" | "overflow" | "visibility" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "component" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "nonce" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "download" | "hrefLang" | "ping" | "rel" | "referrerPolicy" | "align" | "bgcolor" | "border" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "whiteSpace" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "padding" | "paddingBlock" | "paddingInline" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "gutterBottom" | "paragraph" | "TypographyClasses" | "loadApp"> & react.RefAttributes<HTMLAnchorElement>>;
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 __esm = (fn, res) => function __init() {
9
- return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
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 __commonJS = (cb, mod) => function __require() {
12
- return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
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, ...rest } = props;
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)(import_Link.default, {
207
- href: url,
208
- target,
209
- onClick: (event) => onClick && onClick(event, url),
210
- rel: rel || setRel(url, target, absolute),
211
- underline: "hover",
212
- ...rest,
213
- ref,
214
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
215
- children: [
216
- children,
217
- " ",
218
- NewWindowIcon
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 __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
6
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __esm = (fn, res) => function __init() {
8
- return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
9
- };
10
- var __commonJS = (cb, mod) => function __require() {
11
- return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
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 __copyProps = (to, from, except, desc) => {
14
- if (from && typeof from === "object" || typeof from === "function") {
15
- for (let key of __getOwnPropNames(from))
16
- if (!__hasOwnProp.call(to, key) && key !== except)
17
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
18
- }
19
- return to;
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
- init_esm_shims();
103
- import { forwardRef as forwardRef2 } from "react";
34
+ import { forwardRef } from "react";
104
35
  import { default as MuiLink } from "@mui/material/Link";
105
-
106
- // ../icon/src/index.ts
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 = forwardRef2((props, ref) => {
190
- const { href, target = "_self", children, onClick, loadApp = true, rel, ...rest } = props;
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__ */ jsx8(OpenInNewIcon, {}) : null;
195
- return /* @__PURE__ */ jsx8(MuiLink, {
196
- href: url,
197
- target,
198
- onClick: (event) => onClick && onClick(event, url),
199
- rel: rel || setRel(url, target, absolute),
200
- underline: "hover",
201
- ...rest,
202
- ref,
203
- children: /* @__PURE__ */ jsxs("span", {
204
- children: [
205
- children,
206
- " ",
207
- NewWindowIcon
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.2.8",
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.14.12",
35
+ "@mui/material": "^5.15.15",
36
36
  "react": "18.2.0",
37
37
  "react-dom": "18.2.0",
38
- "tsup": "^5.12.7",
39
- "typescript": "^4.6.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": "@nrwl/linter:eslint",
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": "@nrwl/jest:jest",
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(${projectName}): release version ${version} [skip ci]",
37
- "tagPrefix": "@availity/${projectName}@",
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: SystemPropsList,
20
+ exclude: excludedProps,
18
21
  },
19
22
  },
20
23
  canvas: {
21
24
  controls: {
22
- exclude: SystemPropsList,
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' | 'variant'>;
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
- {children} {NewWindowIcon}
75
+ {NewWindowIcon} {children}
77
76
  </span>
78
77
  </MuiLink>
79
78
  );